<html>
<head>
<meta >
用children属性
var div = documentgetElementById('div');var children = divchildren;
你好，
在DOM中实际上有一个叫做textNode的元素，相应的还有documentcreateTextNode的JS方法，而在IE和Chrome浏览器中会将源代码中的换行符渲染成一个textNode，只是视觉上不可见。
然而，通过childNodes来获取子元素的时候，结果会包含这些textNode，所以会得到题主所见的情况。
而解决方法很简单，主要有两种：
第一，使用children代替childNodes
第二，遍历childNodes，根据nodeType过滤掉textNode
希望能解决你的问题。
这个要用到JS中的innerHTML来实现，具体代码如下：
<style>
ul{width:300px; height:auto; margin:0 auto; border:1px dotted #F00; text-decoration:none;}//给UL定义一个样式
li{width:300px; height:30px; line-height:30px; list-style: none; }//控制LI显示样式
</style>
<ul id="aaa">//这里给出UL一个ID，以便JS脚本获取相应元素
<li>中国</li>
<li>美工</li>
<li>意大利</li>
<li>德国</li>
</ul>
<script>
windowonload = function(){
var obj_lis = documentgetElementById("aaa")getElementsByTagName("li");
for(i=0;i<obj_lislength;i++){
obj_lis[i]onclick = function(){
alert(thisinnerHTML);
}
}
}
</script>。
//传入参数：需要遍历的对象，需要匹配的id，获取所有的父级节点的Id
function findIdList(data2, id, children = 'children', level = 0) {
var arrRes = [];
let obj = {
id: 0,
[children]: data2
}
let rev = (data, id, level) => {
if (!data || !data[children] || !data[children]length) {
return;
}
for (var i = 0; i < data[children]length; i++) {
let item = data[children][i];
if (itemid == id) {
// 将匹配到的结果保存到数组
arrResunshift({ level, activeId: itemid });
// 递归它的父级
rev(obj, dataid, 0);
break;
} else if (item[children] && item[children]length > 0) {
//如果有子集，则把子集作为参数重新执行本方法
rev(item, id, level + 1);
}
}
};
rev(obj, id, level);
return arrRes;
}
let list = [
{id: 1, children: [
{id: 11, children: [{id: 12}]}
]},
{id: 2, children: [{id:21, children: [{id: 31}]}]}
]
let b = findIdList(list, 21)
consolelog(b) // [ { level: 0, activeId: 2 }, { level: 1, activeId: 21 } ]
首先我们来介绍一下DOM中元素与节点间的关系：页面中所有内容都是节点[包括元素，属性，文本]，所以节点是包括元素的。
以下是节点的三个属性：
若是火狐和chrome浏览器上述方法不存在兼容问题，而若是在IE8浏览器中后四组内容只能获取元素，无法获取文本或属性。即原获取节点方法-->取元素；原获取元素方法-->undefined。
jQuery中是以方法的形式进行调用，同时都是用来获取元素：
在DhtmlXtree中可以用treegetLeafCount(itemId)获取节点下的子节点数，如果你想计算的是根节点下所有的子节点的话，可以先用上面的计算出根节点下的子节点数然后在有循环判断这些子节点中那个有孩子节点然后在根据treegetLeafCount(itemId)计算此节点下的字节点数，依次循环直至最后。
以上就是关于JS 查找父子节点全部的内容，包括:JS 查找父子节点、javascript如何获得子元素的个数、js获取指定标签下的子节点不要孙节点等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）