首頁猿問想要遍歷文檔中所有的文本節(jié)點，應(yīng)該...

想要遍歷文檔中所有的文本節(jié)點，應(yīng)該有什么樣的解決思路？

JavaScript

慕雪6442864 2018-08-09 09:09:34

查看完整描述

1 回答

米琪卡哇伊

TA貢獻(xiàn)1998條經(jīng)驗獲得超6個贊

測試代碼：

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>Javascript Test</title></head><body>
    <div>this is div        <p>This is paragraph</p>
        <ul>this is ul            <li>number1</li>
            <li>number2</li>
            <li>number3</li>
            <li>number4</li>
            <li>number5</li>
        </ul>
    </div>
    <script>
        var textArray = new Array();        function search(element){            var nodeList = element.childNodes;            for (var i = 0; i < nodeList.length; i++) {                    if (nodeList[i].nodeType == Node.TEXT_NODE && nodeList[i].nodeValue.trim() != "") {
                        textArray.push(nodeList[i].nodeValue);
                    } else if (nodeList[i].nodeType == Node.ELEMENT_NODE) {
                        search(nodeList[i]);
                    }
            }
        }
        search(document.body);        console.log(textArray);    </script></body></html>

測試結(jié)果：

[object Array]
[
      0: "this is div
        ",
      1: "This is paragraph",
      2: "this is ul
            ",
      3: "number1",
      4: "number2",
      5: "number3",
      6: "number4",
      7: "number5",
      8: "        var textArray = new Array();
        function search(element){            var nodeList = element.childNodes;            for (var i = 0; i < nodeList.length; i++) {                    if (nodeList[i].nodeType == Node.TEXT_NODE && nodeList[i].nodeValue.trim() != "") {
                        textArray.push(nodeList[i].nodeValue);
                    } else if (nodeList[i].nodeType == Node.ELEMENT_NODE) {                        search(nodeList[i]);
                    }
            }
        }        search(document.body);
        console.log(textArray);
    ",
      length: 9
   ]

測試環(huán)境：
Windows 7 Ultimate SP1
IE11

反對回復(fù) 2018-09-26