2005-08-08

JavaScript で生成したコードのソースを見る |JavaScript|HTML|firefox|

ここ一週間、JavaScript のコードばかり書いてる。Ajax のおかげで注目著しいということもあり、手を出したいと思ってはいたものの emacs-w3m では未サポートなので二の足を踏んでいた。触ってみると、ブラウザーで結果がすぐに見られるので面白い。特に Windows 系の人たちに受けがいいのが気持ちいい。Unix や Emacs のツールって地味なのが多いから、こういった反応は新鮮。

閑話休題。JavaScript ってデバッグが難しい。JavaScript 歴の短さが主たる原因と自覚はしてるいるものの、愚痴のひとつも...

特に頭を悩ませたのが、JavaScript で生成した HTML のコード。document.createNode とか appendNode で追加したやつ。これはブラウザーの「ページのソースを見る」で実体が表示されない。だから、生成した HTML のコードが自分の期待したものかどうか確かめることができない。閉じタグの場所があっていないとか、生成した要素の attribute が何かとかが調べられない。

そうこう悩んでいたら Sekimura 氏に、よい方法を教えてもらった。firefox 限定の技だけど、ご紹介。

  1. ソースを調べたい領域をブラウザー上でドラッグして反転表示。
  2. 右クリックで「選択した部分のソースを表示」を選ぶ。
  3. 別ウィンドウが開いて、ソースが見られる。

なんといっても、手軽に使えるのがうれしい。同じことを IE でやる方法はあるのかな?

2 comments:

  1. IE自体にはその機能は無いんですが、タグブラウザのSleipnirでそんな機能がありますよ。何故か右クリックにその機能が無いのが不思議ですが。(表示メニューから)

    ReplyDelete
  2. 情報ありがとうございます m(_ _)m。早速、試してみます。

    ReplyDelete