假设我们有一个嵌套范围:
<span><span></span></span>
我们想知道文本是否存在
<span> here <span> </span></span>
或者
<span><span></span> here</span>
假设我们已经引用了父元素节点。
请注意
<span> text <span> text </span> text </span>
或者
<span> text <span> text </span></span>
有两种完全可能的情况。
不应该比这难得多
node.firstChild && node.firstChild.nodeType === Node.TEXT_NODE ||
node.lastChild && node.lastChild.nodeType === Node.TEXT_NODE
为了提高可读性,最好使用Node.*_NODE
符号常量(尽管在较旧的浏览器中可能未定义符号常量)。
为了避免文本节点为空的问题,您可以在此之前加上一个
node.normalize()
哪个
将指定的节点及其所有子树放入“规范化”形式。在规范化的子树中,子树中没有文本节点为空,并且没有相邻的文本节点。
请参阅https://developer.mozilla.org/zh-CN/docs/Web/API/Node.normalize。
要省略注释节点和仅空白文本节点:
var children = Array.prototype.filter.call(node.childNodes || [], function(node) {
return node.nodeType !== Node.COMMENT_NODE &&
(node.nodeType !== Node.TEXT_NODE || /\S/.test(node.nodeValue));
}),
firstChild = children[0],
lastChild = children[children.length-1];
return firstChild && firstChild.nodeType === Node.TEXT_NODE ||
lastChild && lastChild.nodeType === Node.TEXT_NODE;
如果由于某种原因检查内部是否潜伏着一个子元素很重要,那么只需添加一个检查即可
!!node.children.length
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句