人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

javascriptでXPathを使いたいと思っています。

「HTMLをクリックするとその部分のXPath文を取得できる」
(ex)/html/body/div[2]/p[3] などの文が取得したい

ということがしたいのですが、検索で探しても指定したXPath文からどうやってHTMLの要素を取得するかということばかりで、
XPath文自体の生成についてはなく、困っています。

FireFoxのextentionでxpatherというものがあるのですが、これに近いと思います。
https://addons.mozilla.org/ja/firefox/addon/xpather/

ブラウザは、Webkit系のchromeとsafariで動作すればIEなどは対象外でも構いません。

どうぞよろしくお願い致します。

●質問者: gomasa
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:BODY chrome EX firefox HTML
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● y-kawaz
●35ポイント

取得というか、単にDOMを辿ってXPATHを再構築すればよいかと。

例示されたような形式(タグ名のみ表示、兄弟タグが無ければインデックスは省略、兄弟タグがあればインデックス付き)でしたら以下のような関数でどうでしょう。

function getXpath(element) {
 if(element && element.nodeType == document.ELEMENT_NODE) {
 var xpath = arguments.callee(element.parentNode) + '/' + element.tagName;
 var siblings = [];
 for(var i = 0; i < element.parentNode.childNodes.length; i++) {
 var e = element.parentNode.childNodes[i];
 if(e.nodeType == document.ELEMENT_NODE && e.tagName == element.tagName) {
 siblings.push(e);
 }
 }
 if(1 < siblings.length) {
 for(var i = 0; i < siblings.length; i++) {
 if(siblings[i] === element) {
 xpath += '[' + (i+1) + ']';
 break;
 }
 }
 }
 return xpath.toLowerCase();
 }
 return '';
}

デモページ

◎質問者からの返答

どうもありがとうございます!

まさにやりたいことでした。


2 ● うぃんど
●35ポイント

>「HTMLをクリックするとその部分のXPath文を取得できる」

まずはクリックイベントを拾って、クリックされた座標を得る必要があります

下記など参照してみてください

http://www.red.oit-net.jp/tatsuya/java/popmenu.htm

http://d.hatena.ne.jp/uupaa/20100401/1270097629

座標を得ることが出来たならばelementFromPointで「その部分」の要素を得られるようになります

http://www.openspc2.org/reibun/javascript2/DOM/element/0001/inde...

最後に document.evaluate の第二引数を document(文書全体) から elementFromPoint(その部分)に替えます

https://developer.mozilla.org/ja/Introduction_to_using_XPath_in_...

◎質問者からの返答

こちらもとても勉強になりました!

ありがとうございます。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ