2

textNodejQueryが提供していないDOMを完全にサポートするセレクターが必要であることがわかりました。

jQueryはテキストノードを無視します。これはおそらく、ほとんどのページのタグ間に無関係な空白のノードが大量にあり、さまざまなブラウザで異なる方法で処理できるためです。

テキストノードに関するjQueryの質問に対するほとんどの回答は、.contents()テキストノードを含む選択されたアイテムのすべての子ノードを返す関数を使用することになります。他のすべてのjQueryAPIはテキストノードを無視します。

多くの場合、簡単に構築できないものは必要ありませんが.contents()、私はそのような状況にいることに気づきました。

私の使用例は、私が制御できないサードパーティのWebページで、任意のテキストの実行を見つけてラップしたいというものです。（ブラウザ拡張機能またはユーザースクリプトを考えてください。）

これまでのところ、すべてのテキストノードを探してDOMを歩き回ったり、関心のあるすべてのテキストノードを含むラッパー要素を見つけたりして、.contents()それらを反復処理することができます。

しかし今では、クラス内のクラスなどの特定の可能性に焦点を絞るために、jQuery/sizzleセレクターのフルパワーが必要になることがあります。

セレクターを使用してjQueryを拡張する方法を検討しましたtextNodeが、拡張機能が呼び出される前にテキストノードの多くをフィルターで除外するという一般的なルールがあるため、それは不可能のようです。

したがって、セレクターのようなものを提供するが、セレクター式の構文に任意に混合されたテキストノードを選択できる他のJavaScriptツールを探しています。

これが私がする必要があるかもしれないことの例です：

$('.ii:even > div > TXT, .ii:even > div > div.im > TXT')

これは私が個人的にまだ必要としない例ですが、簡単に想像できます：

$('#something .somethingElse TXT')

textNodeの直接の親をアドレス指定（選択）できる場合、それらの反復.contents()は簡単です。任意の祖先のみを識別でき、この下のすべてのテキストノードが必要な場合は、もちろん要素ノードでは簡単です。 。

4

1 に答える 1

4

ここにあなたができることがあります：

jQuery.fn.getTextNodes = function(val,_case) {
    var nodes = [],
        noVal = typeof val === "undefined",
        regExp = !noVal && jQuery.type(val) === "regexp",
        nodeType, nodeValue;
    if (!noVal && _case && !regExp) val = val.toLowerCase();
    this.each(function() {
        if ((nodeType = this.nodeType) !== 3 && nodeType !== 8) {
            jQuery.each(this.childNodes, function() {
                if (this.nodeType === 3) {
                    nodeValue = _case ? this.nodeValue.toLowerCase() : this.nodeValue;
                    if (noVal || (regExp ? val.test(nodeValue) : nodeValue === val)) nodes.push(this);
                }
            });
        }
    });
    return this.pushStack(nodes, "getTextNodes", val || "");
};

次に、次を使用できます。

$("selector").getTextNodes("selector");

これがJSFiddleです。

仕組み.getTextNodes()はとてもシンプルです。引数を渡さない場合、すべてのテキスト ノードが返されます。文字列を渡すと、まったく同じのテキスト ノードが返されますnodeValue。文字列を渡す場合は、大文字と小文字を区別しないチェックのために、2 番目の引数を真の値に設定します。nodeValue最初の引数は、一致する正規表現にすることもできます。

お役に立てれば。

編集$("selector").getNodes("selector").end()： を使用しているため、も使用できることに注意してください.pushStack()。

于 2012-12-12T00:46:14.957 に答える