想要遍历文档中所有的文本节点,应该有什么样的解决思路?

var allTextContent = new Array();  //存储所有文本节点的内容

function seachElemAllTextContent(node){

    for(var Pindex = 0 ; Pindex<node.length; Pindex++){

        node[Pindex] = removeWhitespace(node[Pindex]); //清除空白的文本节点

        var allnodeChildren = node[Pindex].childNodes;

        console.log(allnodeChildren);

        for(var i = 0;i<allnodeChildren.length;i++){

            while(allnodeChildren[i].childNodes.length>0){

                console.log(allnodeChildren[i]);

                seachElemAllTextContent(allnodeChildren[i]);

            }

            // if((allnodeChildren[i].nodeType==3)&&(/^\s+$/.test(allnodeChildren[i].nodeValue))){

            if((allnodeChildren[i].nodeType==3)&&(allnodeChildren[i].nodeValue!=' ')){

                allTextContent.push(allnodeChildren[i].nodeValue);

            }

        }

    }

    console.log(allTextContent);

}

这是我的解决思路,但是结果不对,请大家提点一下。

慕雪6442864
浏览 685回答 1
1回答

米琪卡哇伊

测试代码:<!DOCTYPE&nbsp;html><html&nbsp;lang="en"><head> &nbsp;&nbsp;&nbsp;&nbsp;<meta&nbsp;charset="UTF-8"> &nbsp;&nbsp;&nbsp;&nbsp;<title>Javascript&nbsp;Test</title></head><body> &nbsp;&nbsp;&nbsp;&nbsp;<div>this&nbsp;is&nbsp;div&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p>This&nbsp;is&nbsp;paragraph</p> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<ul>this&nbsp;is&nbsp;ul&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li>number1</li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li>number2</li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li>number3</li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li>number4</li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li>number5</li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</ul> &nbsp;&nbsp;&nbsp;&nbsp;</div> &nbsp;&nbsp;&nbsp;&nbsp;<script> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;textArray&nbsp;=&nbsp;new&nbsp;Array();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;function&nbsp;search(element){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;nodeList&nbsp;=&nbsp;element.childNodes;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;<&nbsp;nodeList.length;&nbsp;i++)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(nodeList[i].nodeType&nbsp;==&nbsp;Node.TEXT_NODE&nbsp;&&&nbsp;nodeList[i].nodeValue.trim()&nbsp;!=&nbsp;"")&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;textArray.push(nodeList[i].nodeValue); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;if&nbsp;(nodeList[i].nodeType&nbsp;==&nbsp;Node.ELEMENT_NODE)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;search(nodeList[i]); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;search(document.body);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(textArray);&nbsp;&nbsp;&nbsp;&nbsp;</script></body></html>测试结果:[object&nbsp;Array] [ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;0:&nbsp;"this&nbsp;is&nbsp;div &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1:&nbsp;"This&nbsp;is&nbsp;paragraph", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2:&nbsp;"this&nbsp;is&nbsp;ul &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;3:&nbsp;"number1", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;4:&nbsp;"number2", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;5:&nbsp;"number3", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;6:&nbsp;"number4", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;7:&nbsp;"number5", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;8:&nbsp;"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;textArray&nbsp;=&nbsp;new&nbsp;Array(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;function&nbsp;search(element){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;nodeList&nbsp;=&nbsp;element.childNodes;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for&nbsp;(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;<&nbsp;nodeList.length;&nbsp;i++)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(nodeList[i].nodeType&nbsp;==&nbsp;Node.TEXT_NODE&nbsp;&&&nbsp;nodeList[i].nodeValue.trim()&nbsp;!=&nbsp;"")&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;textArray.push(nodeList[i].nodeValue); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;if&nbsp;(nodeList[i].nodeType&nbsp;==&nbsp;Node.ELEMENT_NODE)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;search(nodeList[i]); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;search(document.body); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(textArray); &nbsp;&nbsp;&nbsp;&nbsp;", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;length:&nbsp;9 &nbsp;&nbsp;&nbsp;]测试环境:Windows 7 Ultimate SP1IE11
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript