Hatena::ブログ(Diary)

techlog RSSフィード Twitter

理解というものは、つねに誤解の総体に過ぎない
 「スプートニクの恋人」とか「かえるくん、東京を救う 」より

2008-04-10

[](笑)ブックマークレットを作った!

ブラウザで文字を選択した状態で、お気に入りにいれた(笑)ブックマークレットをクリックすると、選択した文字の最後に(笑)が付く!

これだけ!動作確認はこちらでも。


(笑)ブックマークレットのすばらしい効用

  • ネガティブな内容でもちょっと楽しくなる
  • 小馬鹿にできる
  • (笑)が付くと、かなり印象が変わる

例えばこんなキーワードを変換してみる。

f:id:j7400157:20080410223350j:image

絶望する前に”SIer(笑) 2.0”を目指せ

絶望しなくてすみそうだ。

f:id:j7400157:20080410223349j:image

ポインタ(笑)を指すポインタ(笑)(ポインタ(笑)へのポインタ(笑))

どんだけ笑ってんだw


楽しい!文字の力ってすごいなぁ。

(笑)を入れただけなのに。


ブックマークレットについてはよく分からない人は↓を参照。

Bookmarklet。ウェブブラウザで作動するJavaScriptプログラムの一種。

通常ウェブブラウザでブックマーク(お気に入り)を選ぶと、登録しておいたURLに遷移するが、URLの代わりにJavaScriptのプログラムコードをブックマークしておくことで、それを選んだ時にプログラムが実行されてちょっとした機能が実現できる。そのようなものをブックマークレットと言う。

ブックマークレットとは

インデントして、コメントを入れたソースはこんな感じ。動作確認はFirefoxIE7で行った。

javascript:void(
  (
    function(){
      d=document;
      k=''; // キーワード

      // 選択されたキーワードを取得
      if(d.selection){
        k=d.selection.createRange().text;
      }else if(d.getSelection){
        k=d.getSelection();
      }
      
      if(k!=''){
        // キーワードを検索するための正規表現
        r=new RegExp(k,'g');
        // キーワードを検索して置換
        d.body.innerHTML=d.body.innerHTML.replace(r,k+'(笑)');
        d.title=d.title.replace(r,k+'(笑)');
      }
    }
  )()
);

よく分かっていないのは

  • void( (function(){処理}) ())という書き方
    function(){}を()で括って、さらに()が付いているのはなぜだ?
  • replace(r,k+'(笑)')とかは実際のスクリプトでもエスケープしていない
    エスケープしなくても動くのはなぜだ?

問題は

  • タグの中身まで書き変わる
  • IE7で動きがちょっと変

何はともあれ(笑)ブックマークレットで世知辛い世の中を、思いわずらうことなく愉しく生きよう。


関連エントリ


<追記>

        var k=d.selection.createRange().text;

↓に修正

        k=d.selection.createRange().text;

rokuroxrokurox 2008/04/11 16:04 >void( (function(){処理}) ())という書き方

Bookmarkletでは戻り値を返すと戻り値を表示するためにページが移動してしまうので、戻り値を返さないようにするためにvoidを使います。

>function(){}を()で括って、さらに()が付いているのはなぜだ?
最後の括弧は、関数として定義するだけじゃなくて実行するんですよーって意味。関数実行するときにhogehoge()とかやるのと同じです。
functionを()でくくるのは、そうしないとSyntax errorになるからです(笑)

>replace(r,k+’(笑)’)とかは実際のスクリプトでもエスケープしていない
エスケープしなくても動くのはなぜだ?
これはブラウザによって挙動が違うのでなんとも。

j7400157j7400157 2008/04/11 23:31 はじめまして。
いろいろと教えていただきありがとうございます!
とても勉強になります!

>最後の括弧は、関数として定義するだけじゃなくて実行するんですよーって意味。
はじめて知りました。とても納得しました。
void()とかで検索してもvoid(0)ばかり出てきてしまい、うまく調べることができませんでした。

>これはブラウザによって挙動が違うのでなんとも。
Firefoxではお気に入りに入れた時点で、勝手にエスケープされてました。
びっくりだ。

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/j7400157/20080410/1207836820