递归方法
function traverseElement(element) {
// 遍历当前元素的子节点
for (let i = 0; i < element.childNodes.length; i++) {
const node = element.childNodes[i];
// 判断当前节点是否是元素节点
if (node.nodeType === 1) {
console.log(node); // 输出当前元素
traverseElement(node); // 递归遍历当前元素的子节点
}
}
}
// 调用方法开始遍历页面中的所有元素
traverseElement(document.documentElement);
循环方法
const stack = [document.documentElement];
while (stack.length > 0) {
const element = stack.pop();
// 遍历当前元素的子节点并将其压入栈中
for (let i = 0; i < element.childNodes.length; i++) {
const node = element.childNodes[i];
if (node.nodeType === 1) {
stack.push(node);
}
}
console.log(element); // 输出当前元素
}
以上两种方法都可以遍历页面中的所有元素,并输出到控制台中。