サイトのPDFをまとめてダウンロードしたい時
〜「もっと見る(read more)」も「PDF保存」も全自動化する時短術〜 開発者ツールって知っていますか?難しそうに聞こえるかもしれませんが、素人でも使える便利な機能が隠れています。 たとえば、全部一度にみたいのに、6個ぐらいごとに【もっと見る(read more)】ボタンがあって、いちいちそれをクリックしないと全貌が見えない時、とか、ダウンロード可能な教材サイトだけど、【まとめてダウンロード】ボタンはなくて1章ごとにPDFファイルが分かれているため20個ぐらいダウンロードしなきゃいけない時とか、ありますよね。 「全部一括でダウンロードしたい」「何度もクリックするのが面倒!」 そんなことができてしまうのが、ブラウザに標準搭載されている 「開発者ツール」 です。今ならプログラミングの知識がなくても、AIに聞いてコードをコピペするだけで、ブラウザが自動で動いて、こんなささやかな願いがかなっちゃうんですよね。今回は実際に(コード知識が皆無の)わたしが試した具体的な手順をまとめました。 1. まずは開発者ツールの「コンソール」を開く ブラウザの裏側を操作する画面を開きます。どのサイトでも共通の操作です。ちなみに、これはこのサイトはこのようなコードが作られているというのが分かる場面なので、そのサイトに影響を与えたりすることはありませんのでご安心ください。 Windows: F12 キー または Ctrl + Shift + I Mac: Cmd + Option + I または、画面上を右クリックして【検証】を選ぶ すると下画像の右側のようなコード画面が右の方に出てきます。 画面が出てきたら、上部にある 「Console(コンソール)」 というタブをクリックしてください。ここにコードを貼り付けていきます。 実行すると、自動処理が始まります。わたしが使ってみた例を下に記します。 例1. 「もっと見る」を最後まで自動連打する ページを下にスクロールさせたいのに、何度もボタンを押さないと次が出てこない…。そんなときはこのコードの出番です。 const autoClick = setInterval(() => { // サイトに合わせてボタンの文字('もっと見る...