请马上登录，朋友们都在花潮里等着你哦：）
您需要 登录 才可以下载或查看，没有账号？立即注册
x
先上代码：
<div id="mydiv">
<p><span id="sp"></span></p>
</div>
<button id="btnOk" type="button" value="find">按钮</button>
<script>
let ar = [];
let findPars = (element) => {
let pa = element.parentNode;
if(pa.nodeName === 'BODY') return;
ar.push(pa.nodeName);
findPars(pa)
}
btnOk.onclick = () => {
findPars(sp);
console.log(ar);
}
</script>
代码解释：HTML部分不多说，说说JS代码。代码里，先设计一个 ar 数组变量，用来装载遍历到的父元素名称；接着编写一个递归函数 findPars(element)，去俘获 element 参数（子节点元素）的父元素，用 pa 变量装载，使用 parentNode 方法获取。函数中设定一个退出递归出口，就是，如果 pa 获得的节点名称为 BODY，就结束函数的执行，在此之前，则将 pa 变量所获得的节点的名称（nodeName）存入数组 ar 中。函数的 findPars(pa) 就是调用函数自己，这叫递归调用，其中的参数 pa 是上面函数执行是获得的某个父节点；最后是按钮点击事件，执行函数 findPars(element)，element 参数是 sp，就是HTML代码中所呈现的那个 <span> 标签，并将 ar 在控制台打印出来。
DOM文档节点中，任何一个HTML元素都有元素，通常，我们操作其上的最大父元素是 BODY，BODY 之上还有 HTML。本帖，我们只遍历到 BODY 之前的所有父节点，不包含 BODY 。
| 
发表于 2023-1-31 21:28
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡
楼主
发表于 2023-2-1 06:10
