详细整理 js优化针对IE6.0起作用( 二 ) _云知道

}
var end = new Date().getTime();
alert("用时："(end - start)"毫秒");
}
//效率高的
function func2(){
var divs = document.getElementsByTagName("div");
var start = new Date().getTime();
for(var i = 0, len = divs.length; ilen; i){
//"效率高"
}
var end = new Date().getTime();
alert("用时："(end - start)"毫秒");
}

由上表可以看出，在IE6.0下，其差别是非常明显，而在Firefox和Chrome下几乎没有差别，之所以在IE6.0下会有这种情况，主要是因为for循环在执行中，第一种情况会每次都计算一下长度，而第二种情况却是在开始的时候计算长度，并把其保存到一个变量中，所以其执行效率要高点，所以在我们使用for循环的时候，特别是需要计算长度的情况，我们应该开始将其保存到一个变量中。但是并不是只要是取长度都会出现如此明显的差别，如果我们仅仅是操作一个数组，取得的是一个数组的长度，那么其实两种方式的写法都差不多，我们看下面的例子：
复制代码代码如下:
input type="button" value="https://www.rkxy.com.cn/dnjc/效率低" onclick="func1()" /
input type="button" value="https://www.rkxy.com.cn/dnjc/效率高" onclick="func2()" /
var arr2 = [];
for(var i = 0; i10000; i){
arr2[i] = "div"i"/div";
}
//效率低的
function func1(){
var start = new Date().getTime();
for(var i = 0; iarr2.length; i){
//"效率低"
}
var end = new Date().getTime();
alert("用时："(end - start)"毫秒");
}
//效率高的
function func2(){
var start = new Date().getTime();
for(var i = 0, len = arr2.length; ilen; i){
//"效率高"
}
var end = new Date().getTime();
alert("用时："(end - start)"毫秒");
}

从上表可以看出，如果仅仅是一个数组的话，我们看到其实两种写法都是差不多的，其实如果我们把循环再上调到100000次的话，也仅仅是差别几毫秒而已，所以在数组的情况下，我认为都是一样的。对于for循环的优化，也有人提出很多点，有人认为用-=1，或者从大到小的方式循环等等，我认为是完全没有必要的，这些优化往往实际情况下根本没有表现出来，换句话说只是计算机级别的微小的变化，但是给我们带来的却是代码的可读性大大的降低，所以实在是得不偿失。
3、减少页面的重绘
减少页面重绘虽然本质不是JS本身的优化，但是其往往是由JS引起的，而重绘的情况往往是严重影响页面性能的，所以完全有必要拿出来，我们看下面例子：
复制代码代码如下:
div id="demo"/div
input type="button" value="https://www.rkxy.com.cn/dnjc/效率低" onclick="func1()" /
input type="button" value="https://www.rkxy.com.cn/dnjc/效率高" onclick="func2()" /
var str = "div这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/divdiv这是一个测试字符串/div";
//效率低的
function func1(){
var obj = document.getElementById("demo");
var start = new Date().getTime();
for(var i = 0; i100; i){
obj.innerHTML= stri;
}
var end = new Date().getTime();
alert("用时 "(end - start)" 毫秒");
}
//效率高的
function func2(){