JavaScriptでBookmarklet

何となく、JavaScriptを使ったBookmarkletを作って見た。
ブックマークにJavaScriptを書き込んで、ページ上で走らせることができる。
参考：Bookmarklet - ブックマークレットを作成する際のポイント

使ったことはあったけど、自分で作ったことがなかったので
ちょっとやってみた。

基本形：

javascript:( function() { var v; /* do it */ })()

1. 上の無名関数内に実行するスクリプトを書いて、
2. 改行をとって（つまり一行にして）、
3. ブックマークのURLの部分に貼り付けると
4. Bookmarkletになる。

無名関数を使うのは、varで宣言された変数がローカルになるので。
上の基本形を元に作る方が安全と思う。

作ったブックマークボタンを押すと、表示されてるページでスクリプトが実行されます。

いくつか作ってみたので、解説でも。

inputタグの名前を抜き出す。

1. 全input要素を抜き出して：document.getElementsByTagName("input")
2. 要素をループして：for(i=0;i<theForms.length;i++)
3. list変数に書き込んで：list = list + ','+theForms[i].name;
4. alertとして書き出す：alert( list );

javascript:(function() { /* do something */ var theForms = document.getElementsByTagName("input");var list = '';for(i=0;i<theForms.length;i++) list = list + ','+theForms[i].name;alert( list );})()

inputタグの自動入力

今度はinputタグの名前を抜きだし、値として使ってみる。

javascript:(function() { /* do something */ var theForms=document.getElementsByTagName("input");var list='';for(i=0;i<theForms.length;i++) theForms[i].value=theForms[i].name;})()

開発していて、大量の入力フォームがある時に便利かなと思って作って見た。

想定どおりに動くんだけれど、数字のみにしたい、セレクト・チェックボックスなどに対応して内など、細かな問題が多くて使いづらい。

一行なので修正も動作確認も面倒だし、
Bookmarkletは使いどころが難しい、という感想。