ブックマークでプログラムを実行させる

JavaScript

はじめに

ブラウザにはブックマークというサイトのURLを保存する便利な機能がある
大体の人はブックマークを利用するのに、気に入ったサイトを保存するだけでしか利用してないだろう
しかし、ブックマークの特性を生かすとさらに便利な使い方ができる
それは
JavaScriptを実行させる
ということだ

ブックマークでプログラムを動かす

実際にどうやるのか今回はChromeのブラウザを使用して説明する
ブックマークを管理することができる
chrome://bookmarks/
に移動する
URLを直接入れれば移動できるはずだ
Chrome
画面中央付近で右クリックをして新しいブックマークを追加を選択する
Chrome
名前とURLを記入する項目が出てくるので名前はサンプル、URLの中身を下記コードをコピーしていれる

javascript:(function () {
    alert('HELLO！');
})()

そうすると画像のようになるはずだ
Chrome
この状態で保存ボタンをクリックしよう
そうするとサンプルというブックマークができる
動かすのに適当なサイトページに移動する
今回はこちらのサイトを利用することにする
ぽんたろうのサイト
そしてこのサンプルのブックマークをクリックすると画像のようにアラートが出てくる
Chrome
そのサイトでJavaScriptを動かすことができた

便利な使い方

このサイトの各記事のタイトルを取得してクリップボードにコピーする
先ほど同様、新しくブックマークを追加して今度はタイトルコピーという名前で追加する
URLの中身は下記コードになる

javascript:(function () {
var titles = document.querySelectorAll('.entry-card-title');
var titlesText = Array.from(titles).map(function(h2) { return h2.textContent; });
var titlesString = titlesText.join('\n');
var tempTextArea = document.createElement('textarea');
tempTextArea.value = titlesString;
document.body.appendChild(tempTextArea);
tempTextArea.select();
document.execCommand('copy');
document.body.removeChild(tempTextArea);
})()

実際にサイト上でタイトルコピーというブックマークをクリックしてみる
クリックした後、エディターなどに Ctrl + v で貼り付けてみるとタイトルを取得できてるのがわかる

【エラー発生】いきなりMacとペアリングができなくなった
GASで時間節約！Google スプレッドシート
ASP.NET CoreでWEB APIを作成してみる
MauiアプリでGoogleMapを使う
Mauiアプリでバーコードを読み取る
C#でSeleniumを簡単に動かす
iTerm2で同時にVPSを動かす
VPSでUbuntuの初期設定する

このように特定のサイトなどでブックマークからjavascirptを使うことでページ情報など取得するのにとても便利である
サイトによってはセキュリティで許可されていないサイトもある

さいごに

このようにブックマークを使うことにより、様々な使い方ができる
特にいつも同じサイトを見たりしてる場合はなおさらだ
便利ではあるが、使い方にはとても注意が必要だ
自己責任で気を付けて扱ってほしい

コメント