2008年11月22日星期六

HTML中的UI何时更新

今天对比了一下
input type="text"的value

div的innerHTML
两个不同元素的字段,在赋值的时候更新UI的耗时。

测试用例如下
输入 element(div 或 input)
    var t1 = (new Date()).getTime();
    for(var i=0; i<1000; i++)
        element.innerHTML或value  = "" + i;
    var t2 = (new Date()).getTime();
输出 t2 - t1;

结果:
在FF(3.0.3)中
div 153
input 2495
在IE中
div 562
input 31
(毫秒)

值得注意的是,FF中,你可以看到input的更新过程,就是说,每次给input的value赋值都会时时更新到UI。而其他都是等线程从函数返回才更新,因此虽然赋值了很多次,你却只能看到UI更新一次。

没有评论: