[解決済み] jQueryでテキストノードを選択するにはどうすればよいですか？

質問

ある要素のすべての子孫テキストノードを、jQueryコレクションとして取得したい。どのような方法がありますか？

解決方法は？

jQueryには、このための便利な関数がありません。そのため contents() これは、子ノードだけを与え、テキストノードを含むものです。 find() は、すべての子孫要素を与えるが、テキストノードを与えない。以下は、私が思いついたものです。

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

getTextNodesIn(el);

注意：jQuery 1.7以前を使用している場合、上記のコードは動作しません。これを修正するには addBack() で andSelf() . andSelf() は非推奨で、代わりに addBack() 1.8以降では

これは純粋なDOMメソッドと比較するとやや非効率的であり、そのために jQueryのオーバーロードのための醜い回避策。 contents() 機能 (コメントで指摘してくれた@rabidsnailに感謝) そこで、単純な再帰関数を使ったjQuery以外の解決策を紹介します。これは includeWhitespaceNodes パラメータは、空白のテキストノードを出力に含めるかどうかを制御します（jQueryでは自動的にフィルタリングされます）。

更新しました。includeWhitespaceNodesがfalyの時のバグを修正。

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