如何解决使用javascript递归计数文本节点
| 假设我有这样的标记<html id=\"test\">
<body>
Some text node.
<div class=\"cool\"><span class=\"try\">This is another text node.</span></div>
Yet another test node.
</body>
</html>
我的js代码
function countText(node){
var counter = 0;
if(node.nodeType === 3){
counter+=node.nodeValue.length;
countText(node);
}
else{}
}
现在,如果我想计算文本节点
console.log(\"count text : \" + countText(document.getElementById(\"test\"));
这应该返回给我计数,但它不起作用,而且我应该在其他条件下放置什么。
我从未使用过nodeType,因此在使用它时会遇到问题。任何帮助将不胜感激。
解决方法
您的代码中有几处错误:
您的HTML格式不正确。
您是在ing3ѭ后面添加文本,而不是增加文本。
您永远不会循环一个节点的子节点,而总是将同一个节点传递给递归调用。
如果节点不是文本节点,则您什么也不做。
这将起作用:
function countText(node){
var counter = 0;
if(node.nodeType === 3){
counter++;
}
else if(node.nodeType === 1) { // if it is an element node,var children = node.childNodes; // examine the children
for(var i = children.length; i--; ) {
counter += countText(children[i]);
}
}
return counter;
}
alert(countText(document.body));
演示
可以在此处找到对应于哪种节点类型的数字。
更新:
如果要计算单词数,则必须先将每个文本节点拆分为单词。在下文中,我假设单词由空格分隔:
if(node.nodeType === 3){
counter = node.nodeValue.split(/\\s+/g).length;
}
更新2
我知道您想使用递归函数,但是如果您只想计算单词数,那么有一种更简单,更有效的方法:
function countWords(node){
// gets the text of the node and all its descendants
var text = node.innerText || node.textContent
return text.split(/\\s+/g).length;
}
,你想要类似的东西
function countTextNodes(node) {
var n = 0;
if(node.nodeType == 3)
n = 1;
for(var i = 0; i < node.childNodes.length; ++i)
n += countTextNodes(node.childNodes[i]);
return n;
}
可以将其压缩为更紧凑的代码,但为了便于阅读,我在此处进行了说明。
在要计算文本节点的根上调用此方法。例如,要计算整个文档中的文本节点,您需要调用ѭ8。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。