1

我有一个为搜索引擎创建全选功能的 Google Chrome 扩展程序，但速度很慢（1-14 秒，250-1000 个结果）有没有更快的方法来做到这一点？我的代码如下：

var dropdownvalue = dropdown.options[dropdown.selectedIndex].value;
if ((dropdownvalue == "createFullCheckboxes") || (dropdownvalue == "createNameCheckboxes")) {
    var div_embed1 = document.getElementById('results-pane');

    if (div_embed1) {
        div_embed1.innerHTML = '<form id="checkbox-form">' + div_embed1.innerHTML + '</form>';
    }

    var i;
    var x = document.getElementsByClassName('name');

    for (i = 0; i < x.length; i++) {
        x[i].innerHTML = '<input id="checkbox" type="checkbox">' + x[i].innerHTML + '';
    }

    checkedAll();
    return;
}​

我尝试将 for 循环更改为：for (var i = 0, len = x.length; i < len; i++){但只有 20 毫秒的差异。CheckedAll()是一个简单地选择所有复选框的函数。

另一部分（未显示）循环通过选定的复选框并实际上使全选工作在 92 毫秒时快得多，即使对于 1000 个结果它仍然很快。

这是来自 chrome 开发工具的片段：

时间快照

谢谢你。

4

1 回答 1

1

我会测试：

var x = document.getElementsByClassName('name');
var h = '<input class="checkbox" type="checkbox">';
var i = x.length;
while(i--){ x[i].innerHTML = h + x[i].innerHTML; }

相等测试应该比小于测试快。

尝试 Duffs 设备：（推测，因为我们不知道标记渲染和可能产生负面影响的原型属性）（注意删除 id= 以避免重复 ID）替换为类）

function process(xi, h) {
    xi.innerHTML = h + xi.innerHTML;
}
var x = document.getElementsByClassName('name');
var h = '<input class="checkbox" type="checkbox">';
var iterations = Math.floor(x.length / 8);
var leftover = x.length % 8;
var i = 0;

if (leftover > 0) {
    do {
        process(x[i++], h);
    } while (--leftover > 0);
}

do {
    process(x[i++], h);
    process(x[i++], h);
    process(x[i++], h);
    process(x[i++], h);
    process(x[i++], h);
    process(x[i++], h);
    process(x[i++], h);
    process(x[i++], h);
} while (--iterations > 0);
于 2012-05-17T15:19:34.070 回答