2013年9月3日

簡単にページから引用する(javascriptで見ているページのリンクと引用文を取得)

親指シフトにしてからそろそろ一ヶ月。
だいぶ慣れてきた。
スピードはさすがにローマ字タイプの方がまだ速いと思うけれど、直感的に打てるようになってきて、ミスタイプも減ってきた。

さて、今日の話は、javascriptをちょっと勉強したという話。

やりたいこと

まとめサイトというと、2chとかのを思うかもしれないけれど、ネットで調べ物をしていると、いくつかのサイトから引用しながら、まとめをつくりたいときがある。

作業の流れとしてはこんな感じだ。
  1. 引用したいページから、引用部分をコピーする。
  2. ページのurlをコピーする。
  3. ページのタイトルをコピーする。
  4. 全部まとめてhtmlを整形する。
けっこうめんどうだ。
そもそもこんな定型作業は人間の作業ではなくて、パソコンにやらせるべきだ。
誰かが一発でやれるようなスクリプトを書いているのではないか、というか、以前同じようなものを見つけて使っていた気がする。
が、どうにも見つからない。
おまけに調査していると、javascriptでクリップボードを制御する機能はIEしかつかえないのだそうだ。
仕方がないので、最後のコピーはあきらめて、次のような機能をもったツールを求めることにした。

引用箇所を選択して、ボタンを押すと、htmlを自動で生成してくれる

こちらの作業は、テキストを選択して、ボタンを押し、出てきたテキストをコピーするだけ。
だいぶ便利になったはずだ。

参考になる情報

そもそもどんなキーワードで検索していいのか分からないまま、適当に検索していたら、ちょうどよいサイトを見つけた。

ブログを書く上で頻繁に行う引用の手順を簡単にしてくれるブックマークレットを作ってみようと思う。

通常は、引用するサイトの「URL」「ページタイトル」「引用部分」をそれぞれコピーしてきて、blockquoteで修飾するっていうのがお決まりの手順なんだけど、いちいちソースみたりするのはメンドウなのでその辺をブックマークレットで一気にやってしまおうと。


via: 第11回:引用(blockquote)を簡単にするブックマークレット [C!]
ここのをそのまま使えばいいのかと思ったら、どうもうまくいかなくて、2時間ほどはまってしまった。
でも、やりたいことはそのままなので、一番最後のスクリプトを動くようにすることに取り組んだ。
ただ、最後のものはなぜか動かなかったので、2番目の「2)「引用マークアップを生成 - 徒書」を自分流にアレンジ」を簡略化していくことに取り組んだ。

最終的には、こんな感じ。
このスクリプトはご自分のサイトにコピーして使ってくださいな。
(スクリプトはこちらです。)

呼び出す方は、こんな感じ。
引用部分とリンクを取得
ここのwww.ecofirm.com...あたりを自分のサーバに書き換えて、test.htmlとでもして保存しておきます。
そのファイルを開きます。
そのうえで、呼び出し側のリンクをブックマークバーにドラッグすれば準備完了です。
実験用に、「引用部分とリンクを取得」をおいておきます。(適当な場所を選択して、引用という文字をクリック)。

苦労話

なぜか、上記サイトのスクリプトがうまく動かなくて、だいぶ苦労した。
理由はどうも変数の型のようだ。
src.replaceがうまく動いていなくて、そこでスクリプトが実行を停止していたみたい。
string.replaceは上の方でurlの編集でも使っているから動くはず。
なぜ?と思ったんですが、もしかして、型なのか?と思い当たりました。
javascriptって型は自動だと思うんだけど、とりあえず、やってみようと検索したら、IDEA*IDEAに方法が言及されてました。
へー、と思ったのでメモ的にエントリー。というか、かなり個人的メモですな、すみません。

var myVar = "3.14159",
str = ""+ myVar,// to string
int = ~~myVar, // to integer
float = 1*myVar, // to float
bool = !!myVar, /* to boolean - any string with length and any number except 0 are true */
array = [myVar]; // to array
via: JavaScriptの型変換ってこうやるんだ・・・ | IDEA*IDEA
 これを参考に、やっていると、うまくいきました。
おしまい。

0 件のコメント: