在DOM遍历中,IE会忽略空白文本节点,但是firefox、chrome等现代浏览器会把空白文本节点识别为TextNode,在访问诸如[b]childNodes、firstChild、lastChild、nextSibling、previousSibling[/b]等节点时,可能会遇到TextNode。
解决方法大致有2种:
[list]
[*]以nodeType过滤(一般过滤掉nodeType等于3的文本节点即可);
[*]以tagName过滤(文本节点的tagName不存在);
[/list]
例如获取nextSibling:
不知道还有没有其它好方法?
补充一下,dom.children(不含空白孩子节点)方法虽然不是w3c标准,但是实际上各个浏览器基本都支持,也算事实标准了。
更新:
最新的浏览器支持以下dom标准,去除空白节点、文本节点:
childElementCount
children
lastElementChild
nextElementSibling
previousElementSibling
[url]https://developer.mozilla.org/en/DOM/element.firstElementChild[/url]
不过IE只支持children。
解决方法大致有2种:
[list]
[*]以nodeType过滤(一般过滤掉nodeType等于3的文本节点即可);
[*]以tagName过滤(文本节点的tagName不存在);
[/list]
例如获取nextSibling:
//nodeType
function getNextSibling(node){
var nextSibling = node.nextSibling;
while(nextSibling && nextSibling.nodeType !== 1){
nextSibling = nextSibling.nextSibling;
}
return nextSibling;
}
//tagName
function getNextSibling(node) {
var nextSibling = node.nextSibling;
while(nextSibling && !nextSibling.tagName){
nextSibling = nextSibling.nextSibling;
}
return nextSibling;
}
不知道还有没有其它好方法?
补充一下,dom.children(不含空白孩子节点)方法虽然不是w3c标准,但是实际上各个浏览器基本都支持,也算事实标准了。
更新:
最新的浏览器支持以下dom标准,去除空白节点、文本节点:
childElementCount
children
lastElementChild
nextElementSibling
previousElementSibling
[url]https://developer.mozilla.org/en/DOM/element.firstElementChild[/url]
不过IE只支持children。