如何使用 jQuery 有效率地選擇元素內的所有文字節點？

使用 jQuery 選擇文字節點

將元素的所有後代文字節點作為 jQuery 集合檢索可能是一項複雜的任務。由於 jQuery 缺乏專門的函數，因此需要組合使用方法。

解決方案包括使用contents()函數，它檢索子節點（包括文字節點），以及find()函數，它會檢索子節點（包括文字節點）。選擇所有後代元素（不包括文字節點）。透過合併這些結果，可以獲得指定元素內的所有文字節點。

var getTextNodesIn = function(el) {
    return $(el).find(":not(iframe)").addBack().contents().filter(function() {
        return this.nodeType == 3;
    });
};

getTextNodesIn(el);

注意事項：

• 與純粹的方法相比，這種方法可能效率較低DOM 方法。
• 由於 jQuery 的 content() 重載，需要一個解函數。
• 非 jQuery 解決方案（如下圖）提供了更有效的替代方案：

function getTextNodesIn(node, includeWhitespaceNodes) {
    var textNodes = [], nonWhitespaceMatcher = /\S/;

    function getTextNodes(node) {
        if (node.nodeType == 3) {
            if (includeWhitespaceNodes || nonWhitespaceMatcher.test(node.nodeValue)) {
                textNodes.push(node);
            }
        } else {
            for (var i = 0, len = node.childNodes.length; i < len; ++i) {
                getTextNodes(node.childNodes[i]);
            }
        }
    }

    getTextNodes(node);
    return textNodes;
}
getTextNodesIn(el);

以上是如何使用 jQuery 有效率地選擇元素內的所有文字節點？的詳細內容。更多資訊請關注PHP中文網其他相關文章！