【ブックマークレット超入門】使い方と業務効率化のサンプル集

2024.09.27

ブラウザ上の作業を効率化できるブックマークレットの基本的な使い方から活用例まで入門者向けに優しく解説します。

ブックマークレットとは

ブックマークレットとは、ブラウザ上での作業を効率化するための便利機能です。具体的には、Webブラウザのブックマーク（お気に入り）にJavaScriptで記述したプログラムを登録し、呼び出すことができます。ブラウザ上でよく使う操作をワンクリックで実行でき、作業を大きく効率化できます。
ブックマークレットの主な特徴は以下のとおりです。

  1. 簡単に実行可能
    • ブックマークレットはブラウザのブックマークバーからワンクリックで実行できます。特別なソフトウェアのインストールや設定は不要です。
    • プラグインと違ってインストール作業がないため、会社でも利用しやすいです（会社だとセキュリティ対策の面からプラグインのインストールが禁止されていたり、使用許可を得るのが大変だったりします）
  2. 簡単にカスタマイズ可能
    • JavaScriptで記述するため、学習コストが低く、カスタマイズしやすいです。
  3. クロスブラウザ対応
    • ほとんどのモダンブラウザで動作するため、特定のブラウザに依存しません。
  4. 動作が軽量
    • ブックマークレットは非常に小さなプログラムなので、システムリソースをほとんど消費しません。

活用例① ページの翻訳

例えば、以下の短いブックマークレットで、現在開いているページをGoogle翻訳で翻訳することができます。

javascript:window.location='https://translate.google.com/translate?u='+encodeURIComponent(window.location);

ブックマークレットの使い方

① Chromeなどのブラウザで任意のWebページをブックマークします。（ブックマークの名前は任意）

② 作成したブックマークの編集画面を開き、URLの欄に以下のJavaScriptコードを入力します。例えば、以下のようなコードを入力します。

javascript:alert('ブックマークレットが実行されました');

③ ブックマークバーから登録したブックマークレットをクリックすると、プログラムが実行されます。②で作成したコードだと、画面に「ブックマークレットが実行されました」というポップアップが表示されます。②で色々なコードを書くことで、動作をカスタマイズできます。

【Chrome・Edge対応】ブックマークレットの作り方と実行方法
Chrome・Edgeでブックマークレットの作り方と実行する方法を紹介します。
web.joho.info
2024.09.26

活用例とサンプルコード集

関連ページ

【Javascript入門】基礎的な使い方とサンプル集
入門者向けにJavascriptの基本文法やサンプルプログラムを解説しています。
web.joho.info
2024.07.04
ホーム