IT戦記

プログラミング、起業などについて書いているプログラマーのブログです😚

Firebug で XPath を簡単に試す方法

適当に XPath を試したい時に

以下のようにすれば、簡単に XPath をためせます。

document.evaluate(
    '//div[@class="hoge"]', // XPath 式
    document,               // 基準となるノード(要素とか
    null,                   // 名前空間の解決方法(適当にやるときは null
    6,                      // 取得する形式の指定(適当にやるときは 6
    null                    // 結果を再利用するかどうか(適当にやるときは null
);

簡単ですね。
document.evaluate、式、ドキュメント、ヌル、6、ヌル。
覚えましたか?

でも、これを Firebug で実行するとこうなっちゃいます。


うーん。これではどの要素が選択されたかわかりません><
不便ですねー。

というわけで、以下のブックマークレットを実行してあげてください。

javascript:void(XPathResult.prototype.__defineGetter__('length',function(){var l=this.snapshotLength;for (var i=0;i<l;i++)with({i:i})this.__defineGetter__(i,function(){ return this.snapshotItem(i)});return l;}));

えい!

で、 Firebug で XPaht を試す


おおおお!便利ー。

このブックマークレットでは以下のようなことをやってます。

Firebug では length プロパティが数値を持って存在していると、自動で配列っぽい扱いをしてくれます。

XPathResult.prototype.__defineGetter__('length', function() {
  var length = this.snapshotLength;
  for (var i = 0; i < length; i ++)
    with({i:i})
      this.__defineGetter__(i, function(){ return this.snapshotItem(i) });
  return length;
});

それを利用して、 getter として length と数値プロパティを定義したのです。

まとめ

さあ! FirebugXPath の練習をしてみましょう!