.tagName和.nodeName之间的区别

2020/11/18 04:22 · javascript ·  · 0评论

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

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

还有其他几种类型的节点(注释,属性,文本等)。要获取任何各种节点类型的名称,可以使用nodeName属性

当使用nodeName针对元素节点,你会得到它的标签名,这样无论是真的可以使用,但是你会得到浏览器之间更好的一致性使用时nodeName

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


在文章中添加了文字:

tagNamenodeName都是用于检查html元素名称的有用Javascript属性。在大多数情况下,两者都可以正常工作,但是如果仅支持A级浏览器,则首选nodeName;如果要支持IE5.5,则首选tagName。

有两个问题tagName

  • 在所有版本的IE中,!在评论节点上调用时,tagName返回
  • 对于文本节点,tagName返回,undefined而nodeName返回#text

nodeName有自己的问题集,但不那么严重:

  • !在注释节点上调用时,IE 5.5返回这比tagName的危害小,tagName在所有
    版本的IE中
    遭受这种行为
  • IE 5.5不支持nodeName作为document元素或属性。对于大多数实际目的,这两个都不是问题,但在任何情况下都应牢记
  • 使用此属性时,Konqueror会忽略注释节点。但是话又说回来,Konqueror和IE 5.5都不是A级浏览器

因此,nodeName由于它支持更广泛的场景并可能具有更好的前向兼容性,因此在大多数情况下坚持使用更不用说它不会打扰注释节点,注释节点倾向于潜入未声明的代码中。不用担心IE 5.5或Konqueror,它们的市场份额接近0%。

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

nodeName是在“节点”界面http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-F68D095中定义的属性

tagName是在Element接口http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-104682815中定义的属性

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

这就是在Firefox 33和Chrome 38上发生的情况:

HTML:

<div class="a">a</div>

Js:

node = e
node.nodeType === 1
node.nodeName === 'DIV'
node.tagName  === 'DIV'

node = e.getAttributeNode('class')
node.nodeType === 2
node.nodeName === 'class'
node.tagName  === undefined

node = e.childNodes[0]
node.nodeType === 3
node.nodeName === '#text'
node.tagName  === undefined

所以:

  • 仅用于nodeType获取节点类型:nodeName中断nodeType === 1
  • tagName用于nodeType === 1
本文地址:http://javascript.askforanswer.com/tagnamehe-nodenamezhijiandequbie.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!