はてな専用ルビタグ挿入ブックマークレット


HTMLのルビ要素というのは複雑なもので、一つルビを振るために都合5つものタグを開いたり閉じたりしなければならない。いちいち面倒なのでブックマークレットを作った。

javascript:var ruby = prompt("input RUBY", "");var textSelection = new TextInputSelection(document.edit.body);var text = "<ruby><rb>" + textSelection.getText() + "</rb><rp>(</rp><rt>" + ruby +"</rt><rp>)</rp></ruby>";textSelection.setText(text);textSelection.select();


ブラウザのブックマークを適当に一つ作り、アドレス部分を上記のものに差し替え、名前も適当に変更しておく。ルビを振りたい部分を選択して、このブックマークレットを起動するとダイアログが開くので、振仮名を入力するとルビ要素に整形されたものに置き換わる。



ただし条件があって、これははてなダイアリーの「日記を書く」画面の入力欄でしか動作しない。


やっていることは、1.選択している文字列を取得し、2.加工して、3.置き換える、という処理なのだが、2.加工しての部分以外は「日記を書く」画面でもともと使用されているJavascriptに寄生しているためだ。他所のブログを使われている方には申し訳ないが、お使いの編集画面にもおそらく似たような仕掛けがあるだろうから、参考くらいにはなるかもしれない。文字を選択して、ボタンを押すとダイアログが開いて、URLを入力するとハイパーリンクの出来上がりというアレである。


またこれは生のHTMLタグを使用するので、ルビ要素を挿入した場合には、その段落全体をはてな記法の「pタグ停止記法 >< …… ><」で別途囲む必要がある。これが面倒で…。ブロックレベルではなくて、要素レベルで生タグが使えるはてな記法が欲しいが、気をつけないと穴になるので、贅沢は敵である。



世の中にこんなものの需要があるかどうか分からない。自分が使いたくて作った。今は公開している。



というわけで、先日のアレにルビを振りまくっておいた。



.