はてなダイアリーの「注目URL」のページに、はてなブックマークへのリンクを追加する Greasemonkey Script

ううむ。タイトル長い。
まずは「注目URL」をご覧下さい。

はてなダイアリー - 注目URL
http://d.hatena.ne.jp/hoturl

これは、はてなダイアラーたちに、ここ最近注目されているサイトをランキング表示したものです。
注目度 1 位から 50 位まで並んでいますが、各エントリのすぐ横に、小さな曲がった矢印があります。
お知らせ。注目URL」のページの構成が変化しているので、現在ではこのスクリプトは有用ではありません。
このスクリプトをインストールすると、この「小さな曲がった矢印」が、もう一個表示されるようになります。そしてその矢印は、はてなブックマークのエントリのページにリンクするようになります。

インストール用スクリプトとスクリーンショット

注目URLにもはてなブックマークの被ブックマーク件数を表示しエントリーページへのリンクをつけて欲しい。」という要望が idea:1656 として出されていますが、このスクリプトは、その機能の一部*1Greasemonkey Script で実現してみたものです。

var elems;
elems = document.evaluate(
	'//li/a[@href][2]',
	document,
	null,
	XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
	null);

var elem, newelem;
for (var i = 0; i < elems.snapshotLength; i++) {
	elem = elems.snapshotItem(i);
	newelem = elem.cloneNode(true);
	newelem.href="http://b.hatena.ne.jp/entry/" + elem.parentNode.firstChild.href;
	elem.parentNode.insertBefore(newelem, elem.nextSibling);

	elem.setAttribute("title", elem.href);
	newelem.setAttribute("title", newelem.href);
}

もとからある小さな曲がった矢印画像と、それを取り囲む a タグを cloneNode() でコピーして、href の中身を書き換えた後、もとの a タグの直後に追加しています。
このコピー元の a タグを取り出すのに、'//li/a[@href][2]' という XPath 式を使いました。この意味は、「HTML 文書中の li タグの子要素として存在する a タグのうち、href 属性を持っていて、かつ、最初から2つ目のもの」という意味です。
a タグを cloneNode() でコピーする際に、引数として true を渡しているのは、a の子孫要素も含めてコピーしたいか らです。今回の場合、img タグなどがそれにあたります。


スクリプトが動く前の HTML:

<li>
  <a href="http://world.hatelabo.jp/">はてなワンワンワールド</a>
  <a href="/http?//world.hatelabo.jp/">
    <img border="0" src="http://a.hatena.ne.jp/images/uparrow.gif" hspace="3" width="6" height="6">
  </a> 140<br>
  <span class="suburl">http://world.hatelabo.jp/</span>
</li>

スクリプトが動いた前の HTML:

<li>
  <a href="http://world.hatelabo.jp/">はてなワンワンワールド</a>
  <a href="/http?//world.hatelabo.jp/">
    <img border="0" src="http://a.hatena.ne.jp/images/uparrow.gif" hspace="3" width="6" height="6">
  </a>
  <a href="http://b.hatena.ne.jp/entry/http://world.hatelabo.jp/">
    <img border="0" src="http://a.hatena.ne.jp/images/uparrow.gif" hspace="3" width="6" height="6">
  </a> 140<br>
  <span class="suburl">http://world.hatelabo.jp/</span>
</li>

keywords: Greasemonkey | Firefox | 注目URL | はてなダイアリー | はてなダイアラー | はてなブックマーク | XPath | HTML | タグ

*1:リンクだけです。件数は出ません。