テキストエリア内の選択文字列を簡単に実体参照化するブックマークレット

昨日書いた記事のブックマークレットでは Seesaa の投稿画面でしか使えなかった（IE は大丈夫だったかも）が、良く考えたらテキストエリアのあるページならどこでも使えるように書けるのではないかと思ってきたので、書き直してみた。

これならどのページでもテキストエリア内のテキストをマウスなどで選択してブックマークレットを実行すれば、'<'、'>'、'&'、'"' を '&lt;'、'&gt;'、'&amp;'、'&quot;' に変更することが出来ます（多分）。

ソースコードは下記です。コピーしてお気に入りなどに登録してご利用ください（追記：下のリンクを登録で大丈夫です）。ただし、おかしな点があるかも知れないので、自己責任でお願いします。

追記
IE の場合はテキストエリアに限らず選択範囲は置き換えられてしまいます。普通に使う分にはそれほど問題もないかとも思いますが。

更に追記
下のリンクをお気に入りに登録すれば使えるようになります。

javascript:(function(){var d=document;function r(s){return s.replace(/([<>&\"])/g,function(m0,m1){return {'<':'&lt;','>':'&gt;','\"':'&quot;','&':'&amp;'}[m1];});}if(d.selection){d.selection.createRange().text=r(d.selection.createRange().text);}else{var ta=d.getElementsByTagName('textarea');for(var i=0;i<ta.length;i++){if(ta[i].value){var s=ta[i].selectionStart;var e=ta[i].selectionEnd;var v=ta[i].value;var t=v.slice(s,e);if(t)ta[i].value=v.slice(0,s)+r(t)+v.slice(e);}}}})();

ブックマークレットは後で自分でも何をしていたかわからなくなる場合が多いので、改行、スペースなどを入れて見やすくして、コメントを入れたソースコードも貼っておこうかと思います。

javascript:(
  function(){
    var d = document; // 文字数節約
    // 文字を実体参照化する関数
    function r(s){
    return s.replace(/([<>&\"])/g, function(m0,m1) {
    return {'<': '&lt;', '>': '&gt;', '\"': '&quot;', '&': '&amp;'}[m1];
    });
    }
    // IE で選択範囲を取得する場合
    if (d.selection) { 
      d.selection.createRange().text = r(d.selection.createRange().text);
    } else {
      // Firefox, Opera の場合
      var ta = d.getElementsByTagName('textarea'); // ページ内の textarea を取得
      for (var i = 0; i < ta.length; i++) {
        // textarea に入力があれば
        if (ta[i].value) {
          var s = ta[i].selectionStart; // textarea 内での選択開始位置
          var e = ta[i].selectionEnd; // textarea 内での選択終了位置
          var v = ta[i].value; // textarea 内の内容を変数に
          var t = v.slice(s, e); // 選択範囲を textarea の内容から抜き出す
          // 選択範囲を実体参照化して textarea に戻す
          if (t) ta[i].value = v.slice(0, s) + r(t) + v.slice(e);
        }
      }
    }
  })();

やはり改行などを入れると自分でも分かりやすくなったような気もしたけど、ブログだとまた読みにくいかも。