「スプートニクの恋人」とか「かえるくん、東京を救う 」より
2008-04-10
■[JavaScript](笑)ブックマークレットを作った!
ブラウザで文字を選択した状態で、お気に入りにいれた(笑)ブックマークレットをクリックすると、選択した文字の最後に(笑)が付く!
これだけ!動作確認はこちらでも。
(笑)ブックマークレットのすばらしい効用
- ネガティブな内容でもちょっと楽しくなる
- 小馬鹿にできる
- (笑)が付くと、かなり印象が変わる
例えばこんなキーワードを変換してみる。
絶望する前に”SIer(笑) 2.0”を目指せ
絶望しなくてすみそうだ。
ポインタ(笑)を指すポインタ(笑)(ポインタ(笑)へのポインタ(笑))
どんだけ笑ってんだw
楽しい!文字の力ってすごいなぁ。
(笑)を入れただけなのに。
ブックマークレットについてはよく分からない人は↓を参照。
Bookmarklet。ウェブブラウザで作動するJavaScriptプログラムの一種。
通常ウェブブラウザでブックマーク(お気に入り)を選ぶと、登録しておいたURLに遷移するが、URLの代わりにJavaScriptのプログラムコードをブックマークしておくことで、それを選んだ時にプログラムが実行されてちょっとした機能が実現できる。そのようなものをブックマークレットと言う。
ブックマークレットとは
インデントして、コメントを入れたソースはこんな感じ。動作確認はFirefoxとIE7で行った。
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;
トラックバック - http://d.hatena.ne.jp/j7400157/20080410/1207836820
リンク元
- 41 http://bitmap.dyndns.org/blog/archives/001540.html
- 28 http://b.hatena.ne.jp/entry/http://builder.japan.zdnet.com/sp/c-programming-language/story/0,3800083430,20370255,00.htm
- 20 http://www.google.co.jp/search?q=ブックマークレット+書き方&sourceid=navclient-ff&ie=UTF-8&rlz=1B3GGGL_jaJP264JP280&aq=t
- 11 http://bitmap.dyndns.org/blog/
- 9 http://www.google.co.jp/search?hl=ja&client=firefox-a&rls=org.mozilla:ja:official&hs=C6&q=(笑) ブックマークレット&btnG=検索&lr=lang_ja
- 8 http://d.hatena.ne.jp/
- 6 http://www.google.co.jp/search?hl=ja&q=ブックマークレット+書きかた&aq=f&aqi=&aql=&oq=&gs_rfai=
- 6 http://www.google.com/search?hl=ja&lr=lang_ja&ie=UTF-8&oe=UTF-8&q=apache+phpmyadmin&num=50
- 5 http://b.hatena.ne.jp/add?mode=confirm&url=http://d.hatena.ne.jp/j7400157/20080410/1207836820
- 5 http://blog.kaihatsubu.com/archives/001540.html




