.tagName与.nodeName的区别

Question

$('this')[0].nodeName和$('this')[0].tagName有什么区别？

Answer 1

属性专门用于元素节点(类型1节点)，以获取元素的类型。

还有几个其他类型的节点 (注释、属性、文本等)。要获取任何不同节点类型的名称，可以使用属性。

当对一个元素节点使用nodeName时，您将得到它的标记名，因此可以真正使用其中之一，尽管在使用nodeName时会得到浏览器之间更好的一致性。

Answer 2

这很好地解释了两者之间的区别。

增加本条案文：

tagName和nodeName都是检查html元素名称的有用的Javascript属性。在大多数情况下，这两种方法都很好，但如果您只支持A级浏览器，则最好使用nodeName，如果您也打算支持IE5.5，则更倾向于使用tagName。 tagName有两个问题：

• 在所有版本的IE中，tagName在对注释节点调用时返回!。
• 对于文本节点，tagName返回undefined，而nodeName返回#text

nodeName有自己的一组问题，但它们不太严重：

• 在对注释节点调用时，IE5.5返回!。这比所有版本的IE都遭受这种行为的tagName危害小。
• IE5.5不支持nodeName的document元素或属性。这两种情况都不应在大多数实际目的中引起关注，但无论如何都应牢记在心。
• 当使用此属性时，Konqueror将忽略注释节点。但是，康克勒尔和IE5.5都不是A级浏览器

因此，就大多数实际目的而言，由于nodeName支持更广泛的场景和潜在的更好的前向兼容性，所以坚持使用它。更别提它不会在注释节点上打嗝，因为注释节点可能会不知不觉地进入代码中。不要担心IE5.5或Konqueror，因为他们的市场份额接近0%。

Answer 3

在DOM规范中了解这些属性。

nodeName是在节点接口中定义的属性。

http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-F68D095

tagName是在元素接口中定义的属性。

http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-104682815

顺便说一下，节点接口是由DOM树中的每个节点(包括document对象本身)实现的。元素接口仅由DOM树中表示HTML中的元素的节点(具有nodeType === 1的节点)实现。