12

在这里给定一些类似的JS代码:

  for (var i = 0; i < document.getElementsByName('scale_select').length; i++) {
    document.getElementsByName('scale_select')[i].onclick = vSetScale;
  }

如果我们在循环之前将 getElementsByName 的结果放入变量中,然后在循环之后使用该变量,代码会更快吗?

我不确定在现实生活中的影响有多大,结果getElementsByName通常少于 10 个项目。无论如何,我想了解潜在的机制。

另外,如果这两个选项还有什么值得注意的地方,请告诉我。

4

8 回答 8

17

确实。存储它所需的内存只是一个指向 DOM 对象的指针,这每次需要使用某些东西时进行 DOM 搜索要痛苦得多!

理想化代码:

var scale_select = document.getElementsByName('scale_select');
for (var i = 0; i < scale_select.length; i++)
    scale_select[i].onclick = vSetScale;
于 2008-09-22T13:37:13.803 回答
4

缓存属性查找可能会有所帮助,但事实证明在开始循环之前缓存数组的长度更快。

因此,在循环中声明一个包含 scale_select.length 值的变量会加快整个循环的速度。

var scale_select = document.getElementsByName('scale_select');
for (var i = 0, al=scale_select.length; i < al; i++)
    scale_select[i].onclick = vSetScale;
于 2008-09-22T20:06:50.717 回答
3

DOM 的智能实现会自己做缓存,当某些东西发生变化时使缓存失效。但是今天并不是所有的 DOM 都可以这么聪明(咳嗽IE咳嗽),所以最好自己做。

于 2008-09-22T13:59:44.763 回答
1

原则上,如果我们在循环之前将 getElementsByName 的结果放入变量中,然后在循环之后使用该变量,代码会更快吗?

是的。

于 2008-09-22T13:33:53.173 回答
1

使用变量。它们在 JavaScript 中不是很昂贵,而且函数调用肯定更慢。如果您在 document.getElementById() 上循环至少 5 次,请使用变量。这里的想法不仅是函数调用很慢,而且这个特定的函数也很慢,因为它试图在 DOM 中定位具有给定 id 的元素。

于 2008-09-22T13:37:45.550 回答
1

@奥利

缓存在变量中获取的元素的长度属性也是一个好主意:

var scaleSelect = document.getElementsByName('scale_select');
var scaleSelectLength = scaleSelect.length;

for (var i = 0; i < scaleSelectLength; i += 1)
{
    // scaleSelect[i]
}
于 2008-09-23T12:10:18.183 回答
1

There's no point storing the scaleSelect.length in a separate variable; it's actually already in one - scaleSelect.length is just an attribute of the scaleSelect array, and as such it's as quick to access as any other static variable.

于 2009-03-26T14:41:38.297 回答
0

我认同。每次循环时,引擎都需要重新评估 document.getElementsByName 语句。

另一方面,如果该值保存在变量中,则它已经具有该值。

于 2008-09-22T13:35:01.703 回答