Question

假设我有这样的标记

<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这样有问题使用它。任何帮助将不胜感激。

Answer 1

您的代码中存在一些错误：

您的HTML格式不正确。
您要将文字附加到counter而不是增加文字。
您永远不会遍历节点的子节点，您始终将同一节点传递给递归调用。
如果节点不是文本节点，则不执行任何操作。

这将有效：

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));

DEMO

哪个数字对应于哪个节点类型can be found here。

更新：

如果要计算单词，则必须先将每个文本节点拆分为单词。在下面我假设单词用空格分隔：

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;
}

Answer 2

你想要像

这样的东西

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;
}

这可以压缩成更紧凑的代码，但我在这里是为了易读。

在要计算文本节点的根目录上调用此方法。例如，要计算整个文档中的文本节点，您需要调用countTextNodes(document.getDocumentElement())。

使用javascript递归计数文本节点

2 个答案: