年始からこのサイトの静的ページのリニューアルをしていたのだけれど、途中でつまずいて違うことを始めました。
ある人から依頼のあった JavaScript の関数の作成。 firefox にアドオンの Greasemonkey にて、あるサイトをある条件のときに体裁を変更したいらしい、という要望。ちょうど、 DOM Scripting の勉強を去年からちょびちょびしていたけれど、何か作ってみないと実際どんなふうに使っていいかわからないので二つ返事で OK しました。変更したいサイトの HTML を送ってもらって、それを解析しながらの作業。同じく Firefox のアドオンである Firebug を初めてまともに使ってみましたが、やっぱりこれがあるとすごく便利ですね。
まあ、あるサイトっていうのはぶっちゃけ amazon だったのですが、去年リニューアルしたのにバリバリのテーブルタグレイアウトでびっくりしました。テーブルレイアウトまだまだ現役なんですね。
そして目的の table にアクセスするのが一番大変だったかな。なんせそのテーブルに「 id 」が振られてなかったから。ここで DOM Scripting の登場。目的の table にアクセスして id 振って、そのあとは意外とすんなりいけました。
でも、前職で ExcelVBA とかを下手に覚えちゃったから、 JavaScript の細かい文法を忘れてて、 8 年くらい前のリファレンス本を引っ張り出してきてしまいましたが。
わたしが DOM Scripting の勉強に使っている本は「 Web 標準テキスト (1) DOM Scripting 高機能な Web ページ構築のために
さて、自サイトのリニューアル（といっても見かけは変わらなくて、 HTML のコーディングのし直し）の続きでもぼちぼちしますか。どうも Google さんに嫌われているみたいだから（笑）
それが終わったら、 WordPress のバージョンアップとテーマのカスタマイズ。まだまだやることはあるので、無職になっても暇をもてあますことはなさそうです。
※追記
わたしが作成した JavaScript の関数が Greasemonkey で動かないというので、わたしも Firefox に Greasemonkey を入れて検証しました。その時、参照したページをメモとして残しておきます。
・ Greasemonkey のインストールの仕方
→ Google Mania ： asemonkey 入門 ～よくわかるグリースモンキーの使い方 ～
・ Greasemonkey で利用するユーザー関数の作り方
→ Slow Dance ：初めての Greasemonkey の作り方 (Slimtimer Report to Ticket)CommentsAdd Star
今回、動かなかった原因は 3 つ。
ひとつは目的のテーブルの指定がうまくいっていなかったこと。これは amazon のページによっていろいろテーブルの数がいろいろ変化するので、前から数えて何番目と指定していたのを後ろから数えて何番目と変更した。もっといい方法がありそうだけれど、今の力量だとそれが精一杯。
2 つ目は文字コードの問題。調べてみると Greasemonkey で日本語を扱う場合は UTF-8 じゃないと文字化けするみたい。
3 つ目は、わたしの設計ミスで、価格に桁区切りのカンマが入っていたときの処理が抜けていたこと。テスト不足ですね。
下の 2 つは発注側が修正して動くようにしてくれました。
今後の課題としては参考サイトを見ていたら、もっと簡単にテープルのセルにアクセスできるみたいなんでコードを改変して動作を早くしたいです。
