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

var obj = document.getElementById("demo");
var start = new Date().getTime();
var arr = [];
for(var i = 0; i100; i){
arr[i] = stri;
}
obj.innerHTML = arr.join("");
var end = new Date().getTime();
alert("用时 "(end - start)" 毫秒");
}

在例子中，我只是用了100次的循环，因为如果用10000次循环的话，浏览器基本上就卡住不动了，但是即使是100次的循环，我们看看下面的执行结果。

可以看到的是，这简直是一个惊人的结果，仅仅100次的循环，不管是在什么浏览器下，都出现了如此之大的差别，另外我们还发现，在这里，IE6的执行效率居然比起Firefox还要好很多，可见Firefox在页面重绘这方面并没有做一些的优化。这里还要注意的是，一般影响页面重绘的不仅仅是innerHTML，如果改变元素的样式，位置等情况都会触发页面重绘，所以在平时一定要注意这点。
4、减少作用域链上的查找次数
我们知道，js代码在执行的时候，如果需要访问一个变量或者一个函数的时候，它需要遍历当前执行环境的作用域链，而遍历是从这个作用域链的前端一级一级的向后遍历，直到全局执行环境，所以这里往往会出现一个情况，那就是如果我们需要经常访问全局环境的变量对象的时候，我们每次都必须在当前作用域链上一级一级的遍历，这显然是比较耗时的，我们看下面的例子：
复制代码代码如下:
div id="demo"/div
input id="but1" type="button" onclick="func1()" value="https://www.rkxy.com.cn/dnjc/效率低"/
input id="but2" type="button" onclick="func2()" value="https://www.rkxy.com.cn/dnjc/效率高"/

function func1(){
var start = new Date().getTime();
for(var i = 0; i10000; i){
var but1 = document.getElementById("but1");
var but2 = document.getElementById("but2");
var inputs = document.getElementsByTagName("input");
var divs = document.getElementsByTagName("div");
var but1 = document.getElementById("but1");
var but2 = document.getElementById("but2");
var inputs = document.getElementsByTagName("input");
var divs = document.getElementsByTagName("div");
var but1 = document.getElementById("but1");
var but2 = document.getElementById("but2");
var inputs = document.getElementsByTagName("input");
var divs = document.getElementsByTagName("div");
var but1 = document.getElementById("but1");
var but2 = document.getElementById("but2");
var inputs = document.getElementsByTagName("input");
var divs = document.getElementsByTagName("div");
var but1 = document.getElementById("but1");
var but2 = document.getElementById("but2");
var inputs = document.getElementsByTagName("input");
var divs = document.getElementsByTagName("div");
var but1 = document.getElementById("but1");
var but2 = document.getElementById("but2");
var inputs = document.getElementsByTagName("input");
var divs = document.getElementsByTagName("div");
}
var end = new Date().getTime();
alert("用时 "(end - start)" 毫秒");
}
function func2(){
var start = new Date().getTime();
var doc = document;
for(var i = 0; i10000; i){
var but1 = doc.getElementById("but1");
var but2 = doc.getElementById("but2");
var inputs = doc.getElementsByTagName("input");
var divs = doc.getElementsByTagName("div");
var but1 = doc.getElementById("but1");
var but2 = doc.getElementById("but2");
var inputs = doc.getElementsByTagName("input");
var divs = doc.getElementsByTagName("div");
var but1 = doc.getElementById("but1");
var but2 = doc.getElementById("but2");
var inputs = doc.getElementsByTagName("input");
var divs = doc.getElementsByTagName("div");
var but1 = doc.getElementById("but1");

详细整理 js优化针对IE6.0起作用( 三 )

推荐阅读

Photoshop cs5之混合选项的使用

vivos12和iqooneo5s哪个好 vivos12和iqooneo5s对比

oppo怎么设置自定义桌面

如何解除防沉迷

oppo手机屏幕刷新率怎么调

面瘫患者养护宜忌面瘫患者养护宜忌有哪些

洋姜学名叫什么洋姜学名叫啥

过期面粉怎么处理

t_cross中文名

膝盖疼有点肿怎么回事膝盖疼有点肿怎么回事吃什么药

驱除鞑虏什么意思

列举两汉著名的赋作家以及代表作

都哪里地震了,青海都发生了地震

男冬天白色裤子搭配什么鞋子男秋冬白色裤子怎么搭配

永恒纪元修炼石换什么好,创世纪元开启《永恒纪元》魔戒降临

Android 移动办公app