本文介绍了一组用于 JavaScript 的节点遍历函数,旨在解决旧版浏览器(如 IE)中缺乏 Traversal API 支持的问题。通过自定义函数实现 nextElementSibling、previousElementSibling 等标准 DOM 方法的功能,并自动忽略空白文本节点和注释节点,确保获取到真实的元素节点。
节点遍历工具函数介绍
从火狐官网获取的一组函数,其功能等同于 treeWalker。利用这些函数,可以在 Internet Explorer 中实现 Traversal API 2 的全部功能,包括 nextElementSibling、previousElementSibling、firstElementChild、lastElementChild 以及 children。这些函数允许你查找给定节点(元素)的下一个兄弟节点、上一个兄弟节点、第一个子节点和最后一个子节点。其独特之处在于安全地忽略了空白节点,从而确保每次都能获取到你真正寻找的节点。
节点遍历函数实现代码
代码如下:
function is_all_ws(nod) { return !(/[^\t\n\r ]/.test(nod.data)); }
function is_ignorable(nod) { return (nod.nodeType == 8) || ((nod.nodeType == 3) && is_all_ws(nod)); }
function node_before(sib) {
while ((sib = sib.previousSibling)) {
if (!is_ignorable(sib)) return sib;
}
return null;
}
function node_after(sib) {
while ((sib = sib.nextSibling)) {
if (!is_ignorable(sib)) return sib;
}
return null;
}
function first_child(par) {
var res = par.firstChild;
while(res) {
if(!is_ignorable(res)) return res;
res = res.nextSibling;
}
return null;
}
function last_child(par) {
var res = par.lastChild;
while(res) {
if(!is_ignorable(res)) return res;
res = res.previousSibling;
}
return null;
}