document.evaluate（）とXPathを使用して要素のリストを取得するにはどうすればよいですか？私は要素を取得するために<code>document.evaluate()</code> JavaScriptのメソッドを使用してい

Question

は、XPath式で指さ：

var element = document.evaluate(path, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue; 

しかし、どのように私は、XPath式ポイントの複数の要素にケース内の要素のリストを取得しますページ？私は現在読んでいるbookで、次の解決策を見つけ

var element = document.evaluate(path, document, null, XPathResult.ORDERED_NODE_ITERATOR_TYPE, null); 

Answer 1

ドキュメント

var iterator = document.evaluate('//phoneNumber', documentNode, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null); 

try { 
    var thisNode = iterator.iterateNext(); 

    while (thisNode) { 
    alert(thisNode.textContent); 
    thisNode = iterator.iterateNext(); 
    } 
} 
catch (e) { 
    dump('Error: Document tree modified during iteration ' + e); 
} 

Answer 2

から：

は、私は、次のコードを試してみましたが、それは動作しません。コードは Prototype libraryのものだと言われています。

function getElementsByXPath(xpath, parent) 
{ 
    let results = []; 
    let query = document.evaluate(xpath, 
     parent || document, 
     null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); 
    for (let i=0, length=query.snapshotLength; i<length; ++i) { 
    results.push(query.snapshotItem(i)); 
    } 
    return results; 
} 

このようにそれを使用します。

let items = getElementsByXPath("//*"); // return all elements on the page 

Answer 3

私はいくつかの数週間前に同じ問題に懸命に働きました。私は、結果が既に要素のリスト（存在する場合）を表しており、それが谷を反復できることを発見しました。 LIやH2のようなDOM要素の内部テキストを意味する部分文字列または全文文字列の検索を実現するためにjQueryプラグインを構築する必要がありました。 Document.evaluate() | MDN

"p"要素でのみ "アーキテクチャ"という単語を検索し、部分一致する文字列を検索します（<p>todays architecture in Europe</p>では "true"）。テキスト全体の一致（<h2>architecture</h2>）。

var found = $('div#pagecontent').findtext('architecture','p',true); 

検索結果は、通常どおり使用できる通常のjQueryオブジェクトです。

found.css({ backgroundColor: 'tomato'}); 

検索トラフ文書全体及びこのようなすべてのノードタイプ（部分的な結果）

var found = $('body').findtext('architecture','',true); 

のみが正確

var found = $('div#pagecontent').findtext('architecture'); 

に一致するために、上記使用例は、次のように変更することができますプラグイン自体は、 "要素"の単一の "e"の複数形である変数 "es"を表示します。そして、あなたはどのように結果が反復され、どのように表示され、f = f.add($(e))（ "f"は "found"の略語）でオブジェクトの束に集められます。関数の開始は、完全または部分検索（条件の場合は「c」）および検索の文書範囲（「d」）など、さまざまな条件を処理します。

必要whereeverそれは可能性の最大値を表していないことがあり、最適化されてもよいが、それは、現時点では私の最高の知識を表し、エラーなしで実行されていて、それがうまくいけば、あなたの質問に答えることがあります。ここにあります：

(function($) { 
    $.fn.findtext = function(s,t,p) { 
     var c, d; 
     if (!this[0]) d = document.body; 
     else d = this[0]; 
     if (!t || typeof t !== 'string' || t == '') t = '*'; 
     if (p === true) c = './/'+t+'[contains(text(), "'+s+'")]'; 
     else c = './/'+t+'[. = "'+s+'"]'; 
     var es = document.evaluate(c, d, null, XPathResult.ANY_TYPE, null); 
     var e = es.iterateNext(); 
     var f = false; 
     while (e) { 
      if (!f) f = $(e); 
      else f = f.add($(e)); 
      e = es.iterateNext(); 
     } 
     return f || $(); 
    }; 
})(jQuery);