document.getElementById 的运行时间答案

【问题标题】：Running time of document.getElementByIddocument.getElementById 的运行时间
【发布时间】：2011-07-19 07:41:06
【问题描述】：

document.getElementById的运行时间是多少？它最多是对数O(log(n))，其中n 是DOM 中元素的数量，因为DOM 是一棵树。它也可以是常量O(1)，如果在解析 HTML 文档期间，所有具有 ID 的元素都存储在哈希中。我不断听到浏览器吹捧他们品牌的新 javascript 引擎和改进的 DOM 访问，所以我什至不确定所有浏览器的运行时间是否相同。

我问的原因是因为我在Mozilla's WebGL tutorial上读到了这篇文章：

我们在这里做的第一件事是获得一个参考画布，把它藏起来在一个名为 canvas 的全局变量中。显然，如果你不需要反复参考画布，你可以避免保存这个值，而你也可以将其保存在局部变量中或对象的成员字段。

如果 Mozilla 给出了这个警告，也许 $('canvasId') 并不像常量操作那样便宜。也许我应该重写我的代码：

$('id').writeAttribute('foo', 'bar');
console.info($('id').getWidth());
$('id').absolutize();

到：

var element = $('id');
element.writeAttribute('foo', 'bar');
console.info(element.getWidth());
element.absoltize();

【问题讨论】：

我没有在您提供的报价中看到警告。它只是说明您可以持有或不持有该变量。我当然会在一个函数中使用局部变量，但会避免使用全局变量。但绝对第二个例子更快（问题是多少）。
您可能会发现这篇文章与您的兴趣相关：stackoverflow.com/questions/2711303/…

标签： javascript optimization dom performance

【解决方案1】：

当您必须多次访问该元素时，将 DOM 节点的副本保存在局部变量中总是更好。也就是说，我无法想象您会注意到只有三行代码访问该元素会有所不同。

【讨论】：