JS nodeValue和data屬性：獲取指定元素包含的文字

在 JavaScript 中，使用 nodeValue 或 data 屬性可以存取文字節點包含的文字。使用 length 屬性可以獲取包含文字的長度，利用該屬性可以遍歷文字節點中每個字元。

範例

設計一個讀取元素包含文字的通用方法。

//獲取指定元素包含的文字
//引數：e 表示指定元素
//返回包含的所有文字，包括子元素中包含的文字
function text(e) {
    var s = "";
    var e = e.childNodes || e;  //判斷元素是否包含子節點
    for (var i = 0; i < e.length; i ++) {  //遍歷所有子節點
        //通過遞回遍歷所有元素的子節點
        s += e[i].nodeType != 1 ? e[i].nodeValue : text(e[i].childNodes);
    }
    return s;
}

在上面函數中，通過遞回函數檢索指定元素的所有子節點，然後判斷每個子節點的型別，如果不是元素，則讀取該節點的值，否則繼續遞回遍歷該元素包含的所有子節點。

下面使用上面定義的通用方法讀取 div 元素包含的所有文字資訊。

<div id="div1">
    <span class="red">div</span>
    元素
</div>
<script>
    var div = document.getElementById("div1");
    var s = text(div);  //呼叫讀取元素的文字通用方法
    console.log(s);  //返回字串“div 元素”
</script>

這個通用方法不僅可以在 HTML DOM 中使用，也可以在 XML DOM 文件中工作，並相容不同的瀏覽器。