🔖 ブックマークレットジェネレーター

JavaScriptコードをブックマークレット形式に変換します。生成されたリンクをブックマークバーにドラッグして登録できます。ブックマークレットURLから元のコードへの逆変換も可能です。

0文字
JavaScriptコードを入力してください
0文字
Bookmarklet

💡 モバイルでは上のURLをコピーし、ブックマークのURLを手動で貼り付けて登録してください。

使い方・活用例

  • JavaScriptコードを入力すると、自動でブックマークレット形式(javascript: URI)に変換されます
  • 生成されたリンクをブックマークバーにドラッグ&ドロップで簡単登録
  • プリセットから便利なブックマークレットをすぐに利用可能
  • 逆変換タブでは、既存のブックマークレットURLを元のJavaScriptコードにデコードできます

bookmarklet-generatorとは

JavaScriptコードをブックマークレット形式に変換するツール。ブックマークレットとは、ブラウザのブックマークバーに保存して実行できる軽量スクリプトです。このツールを使えば、複雑なJavaScriptコードを安全にブックマーク化し、ワンクリックで実行できます。プリセット機能で一般的なユースケースにも対応しています。

使い方ガイド

1. ツールのテキストエリアにJavaScriptコードを貼り付けます
2. 「ミニファイ」オプションを有効にすると、コードが圧縮されます
3. 「生成」ボタンを押すと、ブックマークレット形式のコードが出力されます
4. 生成されたコードをドラッグしてブックマークバーにドロップします
5. ブックマークバーのアイコンをクリックすると、スクリプトが実行されます

活用シーン

・Webサイト内の検索の自動化:特定のECサイト内で、いつも同じ商品カテゴリを検索する場合、その操作をブックマークレット化して1クリックで実行できます
・ページのスタイル一時変更:Webサイトのテキストサイズを拡大したり、背景色を変更したりするスクリプトを、必要な時だけ実行可能にします
・データの一括取得:複数のテーブルセルを選択してCSV形式でダウンロードするような、自動化タスクをブックマークレット化できます
・開発者向けのデバッグツール:DOMの特定要素をハイライトする、ネットワークリクエストをログ出力する等のデバッグスクリプトを、ワンクリックで実行できます

知っておきたいポイント

ブックマークレットはブラウザのセキュリティサンドボックス内で実行されるため、悪質なコードからは保護されています。ただし、信頼できるソースのコードのみをブックマークレット化すること。また、このツールは逆変換機能も備えており、既存のブックマークレットURLから元のコードを取得することも可能です。ミニファイ機能でコードを圧縮すればURLの長さも短くなり、より使いやすくなります。

よくある質問

ブックマークレットとは何ですか?

ブックマークレットとは、ブラウザのブックマーク(お気に入り)にJavaScriptコードを登録して、ワンクリックで実行できる小さなプログラムです。javascript: URIスキームを使用して、現在表示中のページ上でコードを実行します。

ブックマークレットの登録方法は?

生成されたブックマークレットリンクをブックマークバーにドラッグ&ドロップするか、リンクを右クリックして「ブックマークに追加」を選択してください。または、URLをコピーして手動でブックマークを作成することもできます。

ミニファイオプションとは何ですか?

ミニファイオプションを有効にすると、JavaScriptコードからコメントや不要な空白・改行を除去し、ブックマークレットURLを短くします。ブラウザにはURLの長さ制限があるため、コードが長い場合はミニファイを推奨します。

ブックマークレットにはセキュリティ上のリスクがありますか?

ブックマークレットは現在のページのコンテキストでJavaScriptを実行するため、信頼できるコードのみを使用してください。不明なソースからのブックマークレットは、個人情報の漏洩やページの改ざんにつながる可能性があります。

ブックマークレットURLから元のコードに戻せますか?

はい、このツールの「逆変換」機能を使えば、ブックマークレットURL(javascript:で始まるURL)を貼り付けることで、デコードされた読みやすいJavaScriptコードに変換できます。

ブックマークレットが動作しない場合は?

CSP(Content Security Policy)が厳しいサイトではブックマークレットがブロックされる場合があります。また、コードにエラーがある場合も動作しません。テストボタンで動作確認し、ブラウザのコンソールでエラーを確認してください。

bookmarklet はウェブサイトのクッキーにアクセスできますか?

いいえ、セキュリティ上の理由から、bookmarklet は他のオリジン(ドメイン)のクッキーにアクセスできません。現在訪問しているサイトのクッキーのみ読み取り・操作が可能です。

複数行のコードを bookmarklet に含めることはできますか?

はい、複数行のコードを使用できます。このツールは自動的に改行を削除し、コンパクトなワンラインのコードに変換します。コード内のコメントはミニファイ時に削除されます。

bookmarklet で変数や関数を定義できますか?

はい、可能です。例えば `(function() { var x = 10; console.log(x); })();` のようにIIFE(即座に実行される関数式)を使用して、スコープを限定した変数や関数を定義できます。

bookmarklet で外部ライブラリ(jQuery など)を読み込めますか?

はい、`document.createElement('script')` を使って外部スクリプトを動的に読み込むことができます。例えば jQuery を読み込む場合、ライブラリの読み込み完了を待つために `onload` コールバックを設定する必要があります。

異なるサイトで同じ bookmarklet を使い回せますか?

はい、ほとんどの bookmarklet は複数のサイトで再利用できます。ただしサイト固有のDOM構造やクラス名に依存する場合は、特定のサイトでのみ正常に動作する可能性があります。テストして確認することをお勧めします。

bookmarklet で複数のアクションを順番に実行できますか?

はい、複数のアクションを順番に実行できます。例えば、ページをスクロール → テキストをコピー → アラート表示といった処理を1つのbookmarkletに組み込めます。非同期処理が必要な場合は、Promise や async/await を使用してください。