关于javascript中的元素（element)和节点(node)的区别

最新推荐文章于 2020-10-17 11:34:39 发布

追忆的蔷薇

最新推荐文章于 2020-10-17 11:34:39 发布

阅读量474

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/smallLong/p/6371820.html

版权

在实际工作，由于开发效率问题，很多人会使用的jquery库来代替原生的javascript来对dom进行

操作，而忽略javascript本身对DOM的。

这里只讨论javascript中的元素（element)和节点(node)。

关于childNode属性和children属性的区别·。下面直接上代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
 <div id="parentDiv">
     <!--注释-->
     <div></div>
 </div>
 <script>
     console.log(document.getElementById('parentDiv').childNodes); //NodeList[5]
     console.log(document.getElementById('parentDiv').children) ;  //HTMLCollection[1]
 </script>
</body>
</html>

控制台打印的结果：

childNodes属性返回的是NodeList数组，是属于节点（也包括元素）的属性，而children属性返回的是子元素，是属于元素的属性。

而在Nodelist数组里面也有元素存在，证明了元素也是节点的一种，即元素节点。

W3C中的解释是：

在 HTML DOM （文档对象模型）中，每个部分都是节点：

文档本身是文档节点
所有 HTML 元素是元素节点
所有 HTML 属性是属性节点
HTML 元素内的文本是文本节点（包括回车符也是属于文本节点）
注释是注释节点

Element 对象可以拥有类型为元素节点、文本节点、注释节点的子节点。

NodeList 对象表示节点列表，比如 HTML 元素的子节点集合。

元素也可以拥有属性。属性是属性节点。

总结：元素是元素节点，是节点中的一种，但元素节点中可以包含很多的节点。

转载于:https://www.cnblogs.com/smallLong/p/6371820.html

追忆的蔷薇

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
关于javascript中的元素（element)和节点(node)的区别

在实际工作，由于开发效率问题，很多人会使用的jquery库来代替原生的javascript来对dom进行操作，而忽略javascript本身对DOM的。这里只讨论javascript中的元素（element)和节点(node)。关于childNode属性和children属性的区别·。下面直接上代码 <!DOCTYPE ...
复制链接

扫一扫