- blogs:
- cles::blog
2020/11/24

JavaScript で XPath を使う

JavaScript から HTML のノードを XPath で検索する方法を調べてみました。
Document.evaluate()*1を使うと意外と簡単に実装できますね。
以下のプログラムを以下の HTML に対して実行すると fuga2, fuga3 のノードが取り出せることが確認できます。
var xpathResult = document.evaluate( "//p[ancestor::div[@id='hoge']]", document, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null );
while(var node = xpathResult.iterateNext()) {
console.log(node);
}
sample.html
<code class="html"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test page</title>
</head>
<body>
<p id="fuga1">abc</p>
<div id="hoge">
<p id="fuga2">def</p>
<p id="fuga3">ghi</p>
</div>
<p id="fuga4">jkl</p>
<p id="fuga5">mno</p>
<p id="fuga6">pqr</p>
</body>
</html>
† 参考
トラックバックについて
Trackback URL:
お気軽にどうぞ。トラックバック前にポリシーをお読みください。[policy]
このエントリへのTrackbackにはこのURLが必要です→https://blog.cles.jp/item/12126
Trackbacks
このエントリにトラックバックはありません
Comments
愛のあるツッコミをお気軽にどうぞ。[policy]
古いエントリについてはコメント制御しているため、即時に反映されないことがあります。
古いエントリについてはコメント制御しているため、即時に反映されないことがあります。
コメントはありません
Comments Form
コメントは承認後の表示となります。
OpenIDでログインすると、即時に公開されます。
OpenID を使ってログインすることができます。
サイト内検索
検索ワードランキング
へぇが多いエントリ
閲覧数が多いエントリ
1 . Windows 10 で勝手にログアウトされないようにする(3862)
2 . リモートデスクトップで Alt + PrtSc と同じことをするには(3332)
3 . RDP のプロトコルを TCP だけに変更する(2562)
4 . 「日次」は「にちじ」じゃない?(2385)
5 . リモートデスクトップで Ctrl + Alt + Del キーを送信するには(2293)
2 . リモートデスクトップで Alt + PrtSc と同じことをするには(3332)
3 . RDP のプロトコルを TCP だけに変更する(2562)
4 . 「日次」は「にちじ」じゃない?(2385)
5 . リモートデスクトップで Ctrl + Alt + Del キーを送信するには(2293)
cles::blogについて
Referrers