作ったブックマークレットまとめ

ハロー、そがです。

皆さんは「ブックマークレット」って知っていますか? ざっくり言えば「ブラウザのブックマークでJavaScriptが動かせるよ」ってやつです。この記事は、そがが作ったブックマークレットの備忘録です。

よくある質問と回答

ブックマークレットってなに?

知らない方はこちらをどうぞ。使い方・オススメ・作り方など色々な情報があるので適宜見つけてくださいね。

対象のブックマークレット

わたしが作ったものの中でも「便利だな~」と自画自賛しているものを載せます。一部他のページに載っているものとほとんど同じものもありますが、独立に書いたものなので許してください。

動かないんだけど

WindowsGoogle Chrome上でしか動作確認していないです。特にInternet Explorerだと全然動かないと思います。必要に応じて修正して使いましょう。

ライセンス

Copyright (c) 2022 SOGA
Released under the MIT license
https://opensource.org/licenses/mit-license.php

作ったもの

ブラウジング関連

  • ページ遷移のときにワンクッション置く
javascript:this.onbeforeunload=e=>''

「間違えてリンクを踏んじゃって別のページに移動しちゃった!」なんてことを防げる。

  • ページ内リンクを「新しいタブで開く」に書き換える
javascript:{const re=new RegExp(`^${document.location.href}#`),a=document.getElementsByTagName('a');for(let i=0;i<a.length;++i){if(!re.test(a[i].href)&&a[i].target===''){a[i].target='_blank';}}0;}

違うページへのリンクを「新しいタブで開く」に変える。検索結果とかの画面に戻る手間が省ける。

  • マーカー
javascript:{const d=window.getSelection(),r=d.getRangeAt(0),n=document.createElement('span');if(String(d)){n.setAttribute('style','background-color:rgba(64,172,64,0.5);');n.innerHTML=String(d);r.deleteContents();r.insertNode(n);}}

選択した部分を緑色に塗る。リンクとかは消えてしまうので注意。rgbaのあたりを編集することで好きな色に変更できる。リセットはリロードで。

  • 記述を一時的に消す
javascript:{const d=window.getSelection(),r=d.getRangeAt(0),n=document.createElement('span');if(String(d)){n.innerHTML='[削除しました]';r.deleteContents();r.insertNode(n);}}

気分の悪くなる内容など、選択された部分を[削除しました]に変えることができる。リセットはリロードで。

  • ページの共有
javascript:{let s=window.getSelection().toString();if(s!=='')s=`"${s}"`;prompt('',`${s}${document.title}  ${location.href}`);0;}

URLとタイトルが結合されたものが出てくる。ページ内を選択した状態で使うとそこの引用もできる。

javascript:{const t=new Date(),f=x=>String(x).padStart(2,'0');prompt('',`${document.title} (閲覧: ${t.getFullYear()}-${f(t.getMonth()+1)}-${f(t.getDate())})\n${document.URL}`);0;}
javascript:{const t=new Date(),f=x=>String(x).padStart(2,'0');prompt('',`\\bibitem{} ${document.title} (閲覧: ${t.getFullYear()}-${f(t.getMonth()+1)}-${f(t.getDate())})\\\\ \\url{${document.URL}}`);0;}

レポートの参考文献とかで共有したい場合は、こんな感じで整形や閲覧年月日を付けることができる。上はWord、下はLaTeXを想定。

エンターテイメント

javascript:(()=>{let n=prompt('number:'),out=n+' = ',c,ar=[],i;if(n<2)return;for(i=2;i*i<=n;i++){for(c=0;n%i==0;c++)n/=i;if(c!=0)ar.push(i+(c!=1?' ^ '+c:''));}if(n!=1)ar.push(n);alert(out+ar.join(' * '));})()

素因数分解が手軽にできる。

  • ダイスロール
javascript:{let d=String(window.getSelection()),r;if(d==='')d=prompt('dice notation:');const p=/^\W*(\d*)[Dd](\d+)\W*$/.exec(d);if(p===null){r='?'}else{const p1=p[1]===''?1:parseInt(p[1],10),p2=parseInt(p[2],10),f=()=>Math.floor(Math.random()*p2)+(p2===2||p2===10?0:1),arr=Array(p1).fill(0).map(f);r=`[${d}] ${arr.join(' + ')}${p1===1?'':' = '+arr.reduce((x,y)=>x+y)}`;}alert(r);}

画面上で選択するか入力したDice Notationでダイスを振る。XdYのXは省略可能(1)、Yは2と10のときは0~Y-1、それ以外は1~Yになる。

おわりに

ブックマークレットは手軽に書けてすぐ実行できるのでオススメです。皆さんもブックマークレットを書いて使って生活を豊かにしましょう。

それではまた。