我们可以通过JS代码优化,减轻服务器资源的消耗,加快网页打开速度。
1.使用局部变量避免使用全局变量
比如
function test(){
var s = document.getElementById('aaa');
s.innerHTML = document.body.clientHeight;
}
改成
function test(){
var d = document;
s = d.getElementById('aaa');
s.innerHTML = d.body.clientHeight;
}
局部变量的好处就是减少了作用域链的查找
我建议要是有两次的引用就用局部变量
2.避免使用with(这个估计地球人都知道)
我理解原因就是with会创建自己的作用域,这样就加长了原来的作用域链,使得在with块中执行的代码反而变慢了,在书写上好像省了代码,其实在访问上反而变长变繁琐了,性能下降了
例子
使用with
function test(){
with(document.body){
clientHeight = '200px';
clientWidth = '200px'
}
}
其实都可以写成
function test(){
var ds = document.body;
ds.clientHeight = '200px';
ds.clientWidth = '200px'
}
3. 遍历nodelist的方式
一般的方式都是
var as = document.getElementsByTagName('div');
for(var i=0,l<as.length;i<l;i++){//只计算一次长度}
我的方式一次都不用
for(var i=0,ci;ci=as[i++];){}当nodeList完结时就为false就结束了
好处,没计算长度,省了在循环里赋值,代码更加少了,i++到了判断里
(注意:这个方式用在nodelist里可以,如果你用到array里,可会有问题的,数组里有个0后者null什么的就瞎了)
4.别用那么多个var,一个加逗号就搞定了
var a =1;
var b = 1;
var c =1;
代码长,性能差
拆成
var a=1,
b=1,
c=1;
5.innerHTML是最好的选择
往元素添加元素时,最好用innerHTML
6.ie的removeChild不好用
一般咱们删除一个元素会用
elm.removeChild(subElm)
这个在ie下不好用,因为在ie下这个只是把这个元素从dom树中断开了,但并没用真正删除,它现在变成了孤立的节点了,要想真正删除,可以这样
var ryc = document.createElement('div');
div.appendChild(subElm);
div.innerHTML = '';
div = null;
这样就真的删除了,除了ie外别的都可以用removeChild达到效果
7.为多个同级元素绑定事件时,不用为每个都绑定,为他们的父级绑定就行了
比如
<ul id="a">
本文由虚拟主机域名注册服务商 银众网络(http://www.yinzhong.net) 整理,如需转载,请保留来源。
(责任编辑:admin) |