はてなブログで使える Markdown 記法の "引用" 文章を、JavaScript で作成する

TROJ_POWELIKS

目的
はてなブログ謹製の “引用をストック” を利用する
引用したい文章を範囲選択した後、JavaScript(ブックマークレット) で Markdown 記法の引用を作成する
所感
おまけコード

目的

表題の件、はてなブログで楽に引用を行うにはどうしたらよいか迷ったので、その試行錯誤と解決法を記載する。

はてなブログ謹製の “引用をストック” を利用する

はてなブログ内だと、範囲選択を行った文章を下記のように引用できる。*1

※ --disable-java : Java アプレットなど実行できないようにJAVA無効化 ※ --no-referrers : GETパラメータで重要情報をやりとりしている場合に備えて referrer 削除指定
Chromeブラウザでのユーザ情報偽装について - heyheytower

ちなみに貼り付けられるタグは下記です。

<blockquote cite="http://maijou2501.hateblo.jp/entry/2015/06/16/013936" data-uuid="6653586347153304808"><p>※ --disable-java : Java アプレットなど実行できないようにJAVA無効化 ※ --no-referrers : GETパラメータで重要情報をやりとりしている場合に備えて referrer 削除指定</p><cite><a href="http://maijou2501.hateblo.jp/entry/2015/06/16/013936">Chromeブラウザでのユーザ情報偽装について - heyheytower</a></cite></blockquote>

簡単に引用できるのは良いのですが、Markdown 記法で記事を書いている時の可読性が悪いですし、引用を見ると改行がうまく引用されていないようでした。
（改行の件は、Ubuntu+Chromeの環境由来かもしれませんが。）

引用したい文章を範囲選択した後、JavaScript(ブックマークレット) で Markdown 記法の引用を作成する

引用したい文章を範囲選択した後、ブラウザのコンソールから JavaScript のコードを実行します。

JavaScript コードを実行すると、下記内容のポップアップが行われます。

> ※ --disable-java : Java アプレットなど実行できないようにJAVA無効化  
> ※ --no-referrers : GETパラメータで重要情報をやりとりしている場合に備えて referrer 削除指定  
> <br /><cite><a href="http://maijou2501.hateblo.jp/entry/2015/06/16/013936">Chromeブラウザでのユーザ情報偽装について - heyheytower</a></cite>

Chrome ならこれを “Ctrl+c” でコピーし*2、他のブラウザならポップアップ内容を範囲指定のうえコピーして利用します。
これを本エントリ（編集方法が “Markdownモード"）に貼りつけたものが下記です。

※ –disable-java : Java アプレットなど実行できないようにJAVA無効化
※ –no-referrers : GETパラメータで重要情報をやりとりしている場合に備えて referrer 削除指定

Chromeブラウザでのユーザ情報偽装について - heyheytower

はてなブログ謹製の “引用をストック” と違って、リンクの一行上で改行を行なっています。
これは見やすくするための自分の好みなので、好きに変更すると良いと思います。

こだわりとしては、要素内容は &<> を文字実体参照に置換しています。
属性値のURLは、取得時点で “&<> が文字実体参照でエスケープされていたのでそのまま利用しています。

所感

いままで引用フォーマット作成は手作業だったので、これで引用が捗りそうです。

また、Markdown 記法は方言がたくさんありますので、JavaScript を少し変更すれば引用フォーマットを合わせられると思いますので、広く利用いただければ幸いです。

おまけコード

“現在表示中のページの Markdown 記法のリンクを作成する JavaScript コード” を共有します。

(追記:2017/3/31)MSDNなどのURL内に丸括弧が含まれる場合があり、URLの丸括弧をURLエンコードするようにしました。
しかし、下記のサイトの検証結果のようにブラウザによってURLエンコード結果がalertではURLデコードされた状態になるようです。参考までに、自分の使用しているChromiumは “バージョン 56.0.2924.76 Built on Ubuntu , running on Ubuntu 16.04 (64-bit)” ですがURLデコードされるようで、しかも開発者ツールでの実行ではURLエンコードの状態で表示されました。
なので、自分の環境では “URLの丸括弧をURLエンコードする” は達成されませんでした…