在学习DOM对象操作HTML时，看到removeChild是用于删除节点，想删除第一个p元素，childNodes[0]竟然没反应，要childNodes[1]才能删除第一个P元素，然后我在前面加了没有标签包裹的文字，再用childNodes[0]却又能删去了？意思是[0]只能用于删除没有标签的文本内容吗？还是怎样。。。求解。。
还有childNodes[3]也是没删去一个。。又是为啥。。
代码如下
<body>
<p id="p">
这句话用于测试的
<p id="pid">p的p1元素</p>
<p>p的p2元素</p>
</p>
<script>
function addNode(){
var p=document.getElementById("p");
var node=document.getElementById("pid");
var newnode=document.createElement("p");
newnode.innerHTML="动态添加p元素";
p.insertBefore(newnode,node);//参数分别是要插入的新节点和它的相对位置
}
addNode();
// 删除节点
function removeNode(){
var p=document.getElementById("p");
var p=p.removeChild(p.childNodes[3]);
//从1开始的childNodes[0]没反应
}
removeNode();
</script>
</body>
下面是结果显示。。
p.childNodes[0]的结果
动态添加p元素
p的p1元素
p的p2元素
p.childNodes[1]的结果
这句话用于测试的
p的p1元素
p的p2元素
p.childNodes[3]的结果
这句话用于测试的
动态添加p元素
p的p1元素
p的p2元素
p.childNodes[4]的结果
这句话用于测试的
动态添加p元素
p的p1元素
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
是这样的：childNodes是包括一个元素的所有直接子节点。
比如：
childNodes(0)其实就是这句话用于测试的这个文本节点（注意：文本节点也包括不可见字符，例如回车和换行）。如果想获取所有元素节点，可以使用
children，比如获取第一个元素节点children[0]，就能取到`<p id="pid">p的p1元素</p>`