5

document.evaluate()要素から特定の子要素を抽出するために使用しようとしてい<svg>ます。しかし、それ自体を抽出するだけでは問題があり<svg>ます。まではすべて抽出できます<svg>が、それ以上は抽出できません。たとえば、これはうまくいきます：

document.evaluate('//*[@id="chart"]/div/div[1]/div', document, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null).singleNodeValue)

これは私に（短縮）を与えます：

<div style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;" aria-label="Et diagram.">
    <svg width="600" height="400" aria-label="Et diagram." style="overflow: hidden;"></svg>
    <div aria-label="En repræsentation i tabelformat af dataene i diagrammet." style="position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden;"></div>
</div>

そして、私は単純なことを仮定します

//*[@id="chart"]/div/div[1]/div/svg

私に与えるでしょう<svg>-しかし、何も機能しません。すべての応答タイプを試しました:

for (var type=XPathResult.ANY_TYPE; type<XPathResult.FIRST_ORDERED_NODE_TYPE+1; type ++) {
   console.dir(
      document.evaluate('//*[@id="chart"]/div/div[1]/div/svg', document, null, type, null)
   );   
}

invalidIteratorState、 nullsingleNodeValueまたはsnapshotLength0のいずれかを取得します。

デモ -> http://jsfiddle.net/hw79zp7j/

evaluate()聞いたことのない制限はありますか、それとも完全に間違っているだけですか?

明確にするために、私の最終的な目標は、たとえばGoogleの視覚化xAxis <text>要素を1行のコードで抽出できるようにすることです。現在のように (デモを参照) 、<svg>複数のquerySelectorAll/getElementsByTagNameなどを使用して繰り返し処理する必要があります。xpathGoogle 開発者ツールからを取得して、1 行で再利用するだけでよいでしょう。

4

1 に答える 1

5

SVG 要素は名前空間http://www.w3.org/2000/svgにあり、XPath を使用して名前空間内の要素を選択するには、プレフィックスを名前空間 URI にバインドし、そのプレフィックスをパスで使用して要素名を修飾する必要がありますsvg:svg。そのため、リゾルバーを 3 番目の引数として使用して、evaluate選択できるプレフィックス (例: svg) を上記の名前空間 URI にマップします。

document.evaluate('//*[@id="chart"]/div/div[1]/div/svg:svg', document, 
                                function(prefix) { 
                                    if (prefix === 'svg') 
                                    { 
                                        return 'http://www.w3.org/2000/svg';
                                    }
                                    else
                                    {
                                        return null;
                                    }
                                }, type, null)
于 2015-07-01T13:31:56.660 に答える