私がこれを行う場合:
function getAllTextNodes(root) {
root = $(root || "body");
return root.find("*:not(iframe)").contents().filter(function() {
return this.nodeType === 3 && //Node.TEXT_NODE = 3
$.trim(this.nodeValue) !== "";
});
}
getAllTextNodes($.parseHTML("<div><div>a<div>sub</div>b</div></div>"))
結果は、「a」、「b」、「sub」の配列になります。したがって、それらは構造をトラバースし、要素に到達すると、ネストされた要素を続行する前に、その要素を完全に処理するように見えます。
これは理にかなっているかもしれませんが(または場合によっては問題ではありません)、DOMツリーに表示されるのとまったく同じ順序で要素を返すロジックが必要なため、私の側でいくつかの問題が発生します。 「a」、「sub」、「b」が返されるのを見て幸せです。
それはjQueryが意図的に構築したものですか?どういうわけか順序を変更できますか?それともこれはバグですか?
それはjQueryが意図的に構築したものですか?それともこれはバグですか?
意図的に行われたとは思いませんが、セレクターAPIやほとんどの変更メソッドでさえDOMの順序で結果が得られることを考えると、バグと見なされる可能性があります。あなたが示していることから、それはcontents
単純なで実装されているように見えますflatMap(el => el.childNodes)
。
どういうわけか順序を変更できますか?
はい、内部jQuery.uniqueSort()
で使用するjQueryオブジェクトで使用できますNode.compareDocumentPosition
。
return $.uniqueSort(root.find("*:not(iframe)").contents().filter(function() {
return this.nodeType === 3 && $.trim(this.nodeValue) !== "";
}));
ただし、jQueryはとにかくテキストノードには適していません。ここでは、次のようなネイティブDOMAPIを使用する方が簡単な場合がありますNodeIterator
。
const it = document.createNodeIterator(root[0], NodeFilter.SHOW_TEXT, node => node.data.trim() != ""),
res = [];
for (let node; node = it.nextNode(); )
res.push(node);
return res;
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加