Javascript 文件标题。document.getElementsByTagName（“head”）[0]

使用

document.head

和使用

document.getElementsByTagName（“head”）[0]

有什么区别？我进行的测试表明，它们都需要大约一毫秒的时间

我也看到了

document.head||document.getElementsByTagName("head")[0];

这会让我相信

document.head

更快，而另一个更兼容，只是我做的测试证明了这一点

如果一个更兼容，为什么还要使用另一个呢

---

更新：正如一些人指出的那样，我的测试是错误的。

这与其说是一个性能问题，不如说是一个方便的问题（尽管

document.head

应该有一个微不足道的好处）。使用您喜欢的方法，或者使用一种方法作为另一种方法的备用方法（就像您的示例代码所做的那样）。有回退是明智的，因为IE 6-8不支持

document.head

getElementsByTagName

不太可能很快被弃用，因此这不是一个很好的例子，说明什么时候最好提供回退。您可以安全地单独使用更详细的路由，并在将来享受支持

与旧浏览器相比，事件以及它们在现代浏览器中的传递方式是此类事件的更好例子。出现这样的情况并不罕见：

function callback (event) {
    var id = (event || window.event).target.id;
}

但是在这种情况下，

window.event

部分对于旧式支持是必需的。如果

事件

对象是

未定义的

，我们假定该事件是

窗口

对象上的成员。随着浏览器的成熟，

window.event

不再是一件事，这些测试一致返回

event.target.id

---

同样，您的案例有点不同，因为

getElementsByTagName

可能永远不会像

window.event

那样被弃用或消失。

根据，

document.head

仅在IE 9中获得支持，因此，使用另一种方法作为后备方法可以保护您免受浏览器不兼容的影响

这只是一种方便，因为您每页只能使用一种方法。就像有一个直接的快捷方式到

document.body

，尽管

document.body

是标准的，您不需要回退

document.body || document.getElementsByTagName("body")[0]

除非您只支持IE9+，否则我不会使用

document.head

。在此之前，我将坚持使用

document.getElementsByTagName（“head”）[0]

如果您想要一个不必随着时间推移而更改的版本，可以在脚本顶部执行以下操作

document.head = document.head || document.getElementsByTagName("head")[0];

---

这样，当你放弃对IE8的支持时，你就可以改变这个位置（或者甚至可以把它留在那里，因为它不会带来伤害，但它将是死代码）。上面的代码还将确保使用

|

操作符只查询DOM一次，这是一种特征检测形式。使用时，如果第一个值未定义，则会发回后一个值

所以

document.head || document.getElementsByTagName("head")[0];

原因是，如果不支持

document.head

，至少会返回正确的值

---

---

至于你的速度测试，毫秒是很长的时间。我怀疑这真的花了那么长时间。事实上，我为此做了一个。它表明

getElementsByTagName

函数大约慢了80%。

但是如果

document.getElementsByTagName（“head”）[0]

更兼容，为什么要使用

document.head

呢？@Sortofabeginner因为它更短，更容易阅读。有多种方法可以查询DOM。在某些情况下，另一种方法可能会被弃用。不过，我不怀疑这种情况会发生。您也可以执行

document.querySelector（“head”）

。这只是一个选择的问题。它几乎不会比直接引用更快。因此，

document.head

应该快一点，请参见2019年更新：请停止添加不必要的

| | document.getElementsByTagName（“head”）[0]

，IE8早就死了。同意它们不会占用相同的时间，

getElementsByTagName

随着DOM大小的增加而变慢。而

1ms

则是它表现不佳的标志measured@Sortofabeginner

console.time（）

对于这个目的来说已经足够好了，但是您必须多次测量才能获得足够的准确度

document。querySelector

甚至…document.documentElement不应该包括在内吗？您把身体而不是头放进去了。@Sortofabeginer谢谢，已修复。您只在一个位置修复了它-还有几个其他实例。@sortofabeginner第一个实例旨在显示相同的模式可用于document.bodyFair。我想知道

document.head | |（document.head=document.getElementsByTagName（“head”）[0]）不会快一点吗？我不认为83%的性能损失只是一个方便的问题@jAndy？83%在这个尺度上是可以忽略不计的。一般来说，这不是web开发人员需要担心的预优化类型。我不同意。我希望尽可能快地查询DOM元素，因为这种操作可能会发生数千次。@jAndy如果您的页面数千次查询
head
元素，您就不必涉足这个行业；）我想我们都同意，缓存对DOM节点的引用比重复查找它们要好。但是获取
head
元素的速度差异可以忽略不计。我刚才说的是DOM查询，但我想你只是想在这里开个玩笑。我只是不同意访问属性+执行函数+访问结果HTMLCollection的性能损失与直接引用相比是可以忽略的。这传播了一个非常错误的信息。