出版社サイトToScrapboxブックマークレット
概要
JavaScriptの習得を目指す試みの一環
今回はconstとletを使う癖をつけるのがひとつのテーマ
AmazonToScrapboxブックマークレット自分用の応用として
情報を得るという点ではAmazonで事足りるものではあるけど出版元から取り込みたいという気持ちがあったので
必要になり次第作っていくけど、作ろうと思ってからたまたま最初に訪問したのが双葉社だったのでとりあえず双葉社
(以後他の出版社ごとのブックマークレットを全部載せることはしない)
code:双葉社.js
javascript:(function(){
const url = window.location.href;
// 書名を取得する
const ttl = document.querySelectorAll("#_bookblock_title strong");
// 取得した書名をデフォルト値としてページタイトルを決める
let title = window.prompt('巻数の部分を削除してください。', ttl0.innerText.trim());
if (!title) return;
// 「」をつける
title = '「'+ title +'」';
// 巻数と出版社を含めた文字列を作る
const vol = ttl0.innerText + "(双葉社)\n";
// 著者名を取得する
const a = document.querySelectorAll("div#bookblock_right a");
const author = "+ a0.innerText + "\n";
// 発売日等を取得する
const p = document.getElementById("bookblock_price");
const price = p.innerText + "\n";
// 説明文を取得する
const t = document.getElementsByClassName('txt_area');
let txt = t0.innerText;
txt = "\n> " + txt.replace(/\n/g,'\n> ') + "\n"; // 行ごとに引用の「>」を付与
// 書影を取得する
const image = document.querySelectorAll("#bookblock_coverpic img");// #bookblock_coverpic
const imageurl = "https://" + window.location.host + image0.getAttribute("src");
// 以上の情報を、実際に書き込みたい形に整えてひとつの文字列にまとめる
const lines = vol + ''+imageurl+' '+url+'\n' + author + price + txt;
// URLの形にするためにエンコード
const body = encodeURIComponent(lines);
// 自分のプロジェクトのURLとして開いてページを作成(または同名のページに追記)
window.open('https://scrapbox.io/noratetsu/'+encodeURIComponent(title.trim())+'?body='+body);
})();
所感(この時点でどういう理解レベルで何を得たのかのメモ)
varとconstとlet
【JavaScript】var / let / const を本気で使い分けてみた - Qiita
今回はconstとletを覚えるためにそれらを使って書いたが、関数も条件分岐もほぼない単純なブックマークレットだと全部varでも特に支障はないと思われる
関数や条件分岐の中(特定のスコープの中)で変数を作る時、その外に影響を与えないためにconstとletを使う癖はつけておいたほうが良いだろうと思った
document.querySelectorAll()とかdocument.getElementById()とかをパッと使えるようになってきた
HTMLタグごと取得することになる→innerTextで文字列を取り出す
document.getElementById()以外は戻り値(取得した結果)が配列ノードリストになっているので[0]を忘れない(実際何番目なのかはコンソールでconsole.logを使って確認する)
#Bookmarklet
#JavaScript