nodeType

最新推荐文章于 2023-09-15 16:12:12 发布

xkf520

最新推荐文章于 2023-09-15 16:12:12 发布

阅读量684

点赞数

本文链接：https://blog.csdn.net/xkf520/article/details/50212253

版权

学习了一下node的几个nodeType属性。以前对它一直有点混淆。

nodeType==1 元素节点

nodeType==2 属性节点

nodeType==3 文本节点

在html文档中如何表示呢？例子如下：

<body><p id="demo">请点击按钮来获得 body 元素子节点的节点类型。</p>
<button οnclick="myFunction()">试一下</button>
<script>
function myFunction()
{
var txt="";
var c=document.body.childNodes;
for (i=0; i<c.length; i++)
  {
  txt=txt + c[i].nodeType + "<br>";
  };
var x=document.getElementById("demo");
x.innerHTML=txt;
}
</script>
<p><b>注释：</b>元素中的空格被视作文本，而文本被视作文本节点。</p>
</body>

这里的《body》中NodeList的长度为8，这8个值都是什么呢？

1. <p id="demo">请点击按钮来获得 body 元素子节点的节点类型。</p> ---->nodeType=1

2.换行符 ---->nodeType=3

3. <button οnclick="myFunction()">试一下</button> ---->nodeType=1

4.换行符 ---->nodeType=3

5. <script>

function myFunction()
{
var txt="";
var c=document.body.childNodes;
for (i=0; i<c.length; i++)
  {
  txt=txt + c[i].nodeType + "<br>";
  };
var x=document.getElementById("demo");
x.innerHTML=txt;
}
</script> ---->nodeType=1
6.换行符 ----->nodeType=3
7.<p><b>注释：</b>元素中的空格被视作文本，而文本被视作文本节点。</p> ---->nodeType=1
8.换行符 ----->nodeType=3

上面的例子中， id="demo"为p元素中的属性节点，节点类型为2

xkf520

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
nodeType

学习了一下node的几个nodeType属性。以前对它一直有点混淆。nodeType==1 元素节点nodeType==2 属性节点nodeType==3 文本节点在html文档中如何表示呢？例子如下：请点击按钮来获得 body 元素子节点的节点类型。试一下function myFunction(){var txt="";
复制链接

扫一扫