Chrome ConsoleとJQueryでDOMツリーからデータ加工するメモ

ほぼ初めてなので実際はさくっととはいかなかったけど、次はさくっと行けるようにメモ。

やりたいこと

ブログ書いててブクログの本棚からはてな記法を生成したかった。

Chrome ConsoleでJQueryを使えるようにする

こちらをそのまま参考にさせていただきました。
http://qiita.com/cognitom/items/babefa7b85ffc050d4bd

> (script = document.createElement('script')).src = 'http://code.jquery.com/jquery-latest.min.js'
> document.getElementsByTagName('head')[0].appendChild(script)

DOMツリーを調べる

どのへんのDOMツリーを見るのか適当にあたりをつける。

item-img-areaの下におりていってASINをとればよいっぽい。

データを加工する

CSSセレクタとかJQueryのドキュメントとか見ながらほげほげする。

> $(".item-img-area").children("a").map(function(){var asin = $(this).attr("href").split('/')[3]; return "[asin:"+asin+":image]"})

結果

あとははてなブログとかにコピペすればよい。
数が少ないので手でやってもいいじゃんっていう気になるし何かもっとよいお題があればよかった。