はてなブックマークボタンをJavascriptで動的にする

概要

　このBlogにはてなブックマークボタンを追加しようとしたらはてな提供の自動生成ツールではURLとタイトルが固定のようだ。なのでここではURLとタイトルを動的に変更できるようにJavascriptを使って書き換えます。

環境

• Firefox 4.0.1
• Internet Explorer 8.0
• Chrome 11.0.696.71

作業

　自動生成されたスクリプトはこちらです。（見易いように改行してます）2行目にURL、4行目にタイトルがあるのが分かります。

 href="http://b.hatena.ne.jp/entry/http://chirokings.blogspot.com/"
 class="hatena-bookmark-button"
 data-hatena-bookmark-title="chirokings"
 data-hatena-bookmark-layout="standard"
 title="このエントリーをはてなブックマークに追加">
 src="http://b.st-hatena.com/images/entry-button/button-only.gif"
 alt="このエントリーをはてなブックマークに追加"
 width="20" height="20" style="border: none;" />

　これらを動的に変えられるようにしたのがこちらです。aタグにIDを振ってJavascriptで開いてるページのURLとタイトルを設定します。

 id="hateb"
 class="hatena-bookmark-button"
 data-hatena-bookmark-layout="standard"
 title="このエントリーをはてなブックマークに追加">

 src="http://b.st-hatena.com/images/entry-button/button-only.gif"
 alt="このエントリーをはてなブックマークに追加"
 width="20" height="20" style="border: none;" />

　この方法で動作できるかどうかはこのblogの上の方で試してください。