javascript document.head 诉 document.getElementsByTagName("head")[0]
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16204756/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
document.head v. document.getElementsByTagName("head")[0]
提问by Brian McCutchon
What is the difference between using document.head
and using document.getElementsByTagName("head")[0]
? Tests I ran showed that they both take about a millisecond.
usingdocument.head
和 using 和有什么不一样document.getElementsByTagName("head")[0]
?我运行的测试表明它们都需要大约一毫秒。
I have also seen
我也见过
document.head||document.getElementsByTagName("head")[0];
which would have led me to believe that document.head
is faster and the other is more more compatible, except that the tests I did disproved this.
这会让我相信它document.head
更快,另一个更兼容,除了我所做的测试反驳了这一点。
And if one is more compatible, why use the other as well?
如果一个更兼容,为什么还要使用另一个?
Update:My tests were wrong, as some have pointed out.
更新:正如一些人指出的那样,我的测试是错误的。
采纳答案by Travis J
Using the ||
operator like that is a form of feature detection. When used, if the first value is undefined it sends back the latter value.
||
像这样使用运算符是特征检测的一种形式。使用时,如果第一个值未定义,则返回后一个值。
So for
因此对于
document.head || document.getElementsByTagName("head")[0];
the reason is that if document.head
is not supported at least the right value is returned.
原因是如果document.head
不支持,至少返回正确的值。
As for your speed test, a millisecond is a long time. I doubt it really took that long. In fact, I made a jsPerf
for this. It shows that the getElementsByTagName
function is roughly 80% slower.
至于你的速度测试,一毫秒是很长的时间。我怀疑它真的花了那么长时间。事实上,我为此做了一个jsPerf
。它表明该getElementsByTagName
函数大约慢了 80%。
回答by Alex.Bullard
回答by Sampson
This is more of a convenience matter than a performance one (though document.head
should have a negligible benefit). Use which ever you like, or, use one as a fallback to the other (as your example code does). Having the fallback is wise, since document.head
is not support in IE 6-8.
这比性能更方便(尽管document.head
应该有微不足道的好处)。使用您喜欢的任何一种,或者使用一种作为另一种的后备(如您的示例代码所做的那样)。回退是明智的,因为document.head
IE 6-8 不支持。
It's not likely that getElementsByTagName
will soon be deprecated, so this isn't a great example of when it's good to provide a fallback. You could safely use the more verbose route on its own and enjoy support on into the future.
不太可能getElementsByTagName
很快会被弃用,因此这不是提供回退的好例子。您可以安全地单独使用更详细的路由,并享受未来的支持。
Better examples of these types of things would be events, and how they're passed around in modern browsers, compared to older browsers. It is not uncommon to see something like this:
与旧浏览器相比,这些类型的事情更好的例子是事件,以及它们在现代浏览器中的传递方式。看到这样的事情并不少见:
function callback (event) {
var id = (event || window.event).target.id;
}
In this case though, the window.event
portion is necessary for legacy support. If the event
object is undefined
, we assume the event is a member on the window
object. As browsers mature, window.event
ceases to be a thing, and these tests unanimously return event.target.id
instead.
但是,在这种情况下,该window.event
部分对于遗留支持是必需的。如果event
对象是undefined
,我们假设事件是window
对象的成员。随着浏览器的成熟,window.event
不再是一回事,而这些测试一致返回event.target.id
。
Again, your case is a bit different as getElementsByTagName
will likely never be deprecated or vanish as window.event
did.
同样,您的案例有点不同,因为它getElementsByTagName
可能永远不会像window.event
以前那样被弃用或消失。
回答by Juan Mendes
Just convenience because you are only supposed to have one per page. Just like there is a direct shortcut to document.body
, although document.body
is standard and you wouldn't need the fallback.
只是为了方便,因为您应该每页只有一个。就像有一个直接的快捷方式一样document.body
,虽然document.body
是标准的,你不需要回退。
document.body || document.getElementsByTagName("body")[0]
I wouldn't use document.head
unless you only support IE9+. Until then, I would stick to document.getElementsByTagName("head")[0]
document.head
除非你只支持 IE9+,否则我不会使用。在那之前,我会坚持document.getElementsByTagName("head")[0]
If you want a version that you don't have to change as time goes by, you can do the following at the top of your script
如果你想要一个不需要随着时间推移而改变的版本,你可以在你的脚本顶部执行以下操作
document.head = document.head || document.getElementsByTagName("head")[0];
That way you can just change that one place when you drop support for IE8 (or may even leave it there since it doesn't hurt, but it will be dead code). The above code would also make sure you only query the DOM once
这样你就可以在你放弃对 IE8 的支持时改变那个地方(或者甚至可以把它留在那里,因为它不会受到伤害,但它会是死代码)。上面的代码还可以确保你只查询一次 DOM