<a href="javascript:var%20mylib=document.createElement('script');if(!window.NAME){mylib.setAttribute('src','URL');mylib.setAttribute('charset','shift_jis');document.body.appendChild(mylib);(function(){if(window.NAME){NAME.init();}else{setTimeout(arguments.callee);}})();}else{NAME.init();}void(mylib);"
onclick='
alert('ブックマークバーにドロップして下さい(IEではお気に入りバー/右クリックからも可)');
if (window.navigator.appName.toLowerCase().indexOf("microsoft") > -1) {
event.returnValue = false;
}
event.preventDefault();
event.stopPropagation();
'
>ブックマークレットのスケルトン</a>
▼ JavaScript 部分を整形したもの
var mylib = document.createElement('script');
if (!window.NAME) {
mylib.setAttribute('src', 'URL');
mylib.setAttribute('charset', 'shift_jis');
document.body.appendChild(mylib);
(function() {
if (window.NAME) {
NAME.init();
} else {
setTimeout(arguments.callee);
}
})();
} else {
NAME.init();
}
void(mylib);
arguments.callee は無名関数自身なので、window.NAME がロードされるまで呼び続けられます。ロード済みの場合は、読み込まれた外部ライブラリの NAME.init(); が実行されます。ブックマークレットの二度目の実行では、既に読み込まれた外部ライブラリより実行されます void(mylib); で、void の引数に mylib を使っているのに深い意味はありません。void(0) でもかまいません。最後に void(0) が無いと、画面が壊れてしまうから付加するのが通常です( alert 等のウインドウ処理が最後にある場合は付加しなくても動作します。) ▼ 外部スクリプト部分
if (!window.NAME) {
(
function() {
window.NAME =
{
// プロパティ
version: 1.01
,
// メソッド
init : function( ) {
/* ここに処理を書きます */
alert("この alert はテスト用です");
}
};
}
)();
}
仕込み方にもいくつかあって、ウインドウ開ける方法もありますし、IFRAME で埋め込んで配置する方法もあります。この方法は、ページの一部分を一回だけ JavaScript で変更してしまう比較的基本的な方法です。 要するに、スクリプトタグを BODY 要素の最後に追加して、そのスクリプトタグに外部の js ファイルを読み込ませてその中の処理を呼び出すものです。自分で一から書くと結構面倒で、専門知識も多く知っていないとなかなか完成まで時間がかかりますが、スケルトンを使うと必要最低限のコード追加と環境整備で実装環境を作る事ができます。 このスケルトンで注意するのは、呼び出す js ファイルは SHIFT_JIS で書くというところです(Window 環境では普通に作成する SHIFT_JIS になってしまうので)。これは、呼び出す方の記述で charset="shift_jis" を書いているからです。UTF-8 にしたい場合は、href 内のその記述部分も変更する必要があります。 後、一般的なデバッグで気を付けるのは、変更してアップロードする毎にキャッシュを削除する事です( 面倒ですけど、結局効率アップになります )。さらに、JavaScript の動的コンテンツは、ソースを単純に表示しても見る事ができないので、開発者ツールで結果を確認する必要もあります。 ブックマークレットは、表示されているページと同じセキュリティで参照されるのでたいていの事ができます。主な目的は、エンドユーザーの操作レベルでの効率を上げる事です。IE 拡張メニューや Firefox の拡張と似ていますが、後者は厳密にはセキュリティの壁があります。そのかわり、後者は OS のローカル情報にアクセスできるメリットがあります。 元来、サービス運営側はサーバーのシステムの管理上なかなかエンドユーザーの利便性にまで手をだせないものです。通常、少しの変更が多くのユーザに影響するので、慎重にならざるを得ません。ですから、この手のプラグイン的なツールは、エンドユーザ側で提案すべきものであり、サービスを提供する側とエンドユーザが、お互い利益を得るような形態が望まれます。
|
|
【JavaScriptの最新記事】
- Firebase の Realtime Database の JSON を jQuery の $.ajax で読み込んで TABLE を作成する
- Firebase に定義した Realtime Database の API を使用して TABLE を作成する
- IE や Firefox の開発者ツールのコンソールで簡単に localStorage を見る為の1行コード
- テキストエリアでタブ処理
- ブラウザ判定 : String.prototype.browser に登録して、文字列と実際のブラウザが一致したら true を返す
- jQuery UI の datepicker を使用した現在の日付文字列の取得 と 一般的な現在の日付文字列の加工取得処理
- geolocation を使用して『都道府県選択コンボボックス』の初期値を現在の緯度・経度から選択する
- 雪を降らす snowstorm.js の 特定 DIV 内での実装
- いまさらですが、JavaScript で、グローバル領域を汚さない変数宣言の使用方法
- 二回目のロードは無視する、JavaScrip ライブラリの基本スケルトン
- ブックマークレットから、ページ中央に固定する IFRAME ウインドウを作成する
- JavaScript の全ての オブジェクトに同じ機能を持たせる
- JavaScript : コンボボックスの OPTION 部分の操作でたいていのテクニック
- JavaScript : 文字列で表現された日付を論理チェック
- HighslideJS 用貼り付けコード作成
- テキストエリアに入れた JSON データをチェックするコード(F12等の開発者ツールも使う) / JSON.stringify と JSON.parse
- エレメント(主にPRE)を選択状態にする
- JS : function() {} という『無名の処理』の理解
- GoogleVisualizationAPIを使用したブラウザ比率の円グラフ(2009年3月〜) / IE がまだ半分を占めてます
- Safari for windows の alert




























