什么是节点（好家伙,我弄懂了）
掌握了DOM节点的知识之后，是时候区分DOM节点和元素了。
如果你懂节点术语，那么答案是显而易见的：元素是特定类型的节点元素，还有文档、注释、文本等类型。
简而言之，元素是在HTML文档中使用标记编写的节点。Htmlheadtitlebodyh2p都是元素，因为它们是用标签表示的。
文档类型、注释和文本节点不是元素，因为它们不是用标签编写的：
Node是一个节点的构造函数，HTMLElement是JS DOM中一个元素的构造函数。Paragraph既是节点又是元素，是Node和HTMLElement的实例。
const paragraph=document . query selector；节点的段落实例；HTMLElement的真实段落实例；//=true简单来说，元素是节点的子类型，就像猫是动物的子类型一样。
3. DOM属性：节点和元素
除了区分节点和元素，还有必要区分只包含节点或元素的DOM属性。
节点的以下属性计算为节点或节点集合：
node.parentNode//Node或null node.firstChild//Node或null Node . last child；//Node或null node.childNodes//NodeList但是，下列属性是元素或元素的集合：
node.parentElement//HTMLElement或null node.children//HTMLCollection既然node.childNodes和node.children都返回子列表，为什么要同时拥有这两个属性呢？好问题！
考虑以下包含一些文本的段落元素：
谢谢你访问我的网页！打开演示，然后查看parapgraph节点的childNodes和children属性：
const paragraph=document . query selector；paragraph.childNodes//nodelist : paragraph . children；//html collection : paragraph . child nodes集合包含2个节点：感谢、和访问我的网页！文本节点！
但是，paragraph.children集合只包含一项：谢谢。
由于paragraph.children只包含元素，所以这里没有文本节点，因为它的类型是文本，而不是元素。
有了node.childNodes和node.children，我们可以选择要访问的子节点集：所有子节点或只有子节点是元素。
4.总结
DOM是节点的分层集合，每个节点可以有一个父节点和/或一个子节点。如果知道什么是节点，就很容易知道DOM节点和元素的区别。
节点有多种类型，元素类型就是其中之一。在HTML文档中，元素由标签表示。
End ~我是小智，我要去洗碗了，下次见！
原文：https://dmitripautin.com/dom-node-element/
发表评论