用户投稿面试的时候很常会被问到 DOM 是什么？
那 Node 和 HTMLElement 又是什么呢？
DOM(Document Object Model) 是由多个 DOM Node 物件节点所组成的文件(树)物件模型。
DOM Node
图片中第一个区块是我们写的 HTML 语法，下面的区块是转成节点的样子。
DOM document 包含很多节点：<html> 是一个 node 节点，包含2个子节点：
<body> 也是一个 node 节点，有1个父节点 html，包含3个子节点：
<!-- Page Body -->标题 <h2>段落 <p><p> 本身是 node 节点，包含1个子节点：
DOM Node Types
从上述了解 DOM Nodes 的过程中，可以得知 Node 有很多种型态，html、body、注解、文字...等，各个型态都是一个节点。
Node.ELEMENT_NODENode.ATTRIBUTE_NODENode.TEXT_NODENode.CDATA_SECTION_NODENode.PROCESSING_INSTRUCTION_NODENode.COMMENT_NODENode.DOCUMENT_NODENode.DOCUMENT_TYPE_NODENode.DOCUMENT_FRAGMENT_NODENode.NOTATION_NODEDOM Element
而 DOM Element 是 node(Node.ELEMENT_NODE) 其中一个型态，也就是常用到的 HTML tags，像是<html> <body> <h2> <p>...等。
<p> 同时是 DOM Node，也是 HTML Element<!-- Page Body --> 是 DOM Node，但不是 HTML Element总结
Nodes 节点有很多种型态，DOM Element 是 Node 其中一种型态，而 DOM 表示整个节点和元素组成的树状结构。
参考来源：
https://dmitripavlutin.com/dom-node-element/
https://iter01.com/233214.html
微信扫一扫打赏
支付宝扫一扫打赏
