
簡単にDOM操作後のソースを確認する方法をご紹介。
DOM操作っていうのは分かりやすく言えば、JavaScriptを使用してWebページの内容や配置、スタイルを操作する事です。
例えばソースコードを綺麗に表示するJS「dp.SyntaxHighlighter」で紹介しているScriptもDOMを操作するものです。
このDOM操作を行った場合に、ブラウザ上でソースを確認しても操作前のソースしか表示されません。
そこでFireFoxの「選択した部分のソースを表示」機能を使用します。
以下で実際に見てみましょう。
※この記事IEをお使いの方は全く楽しめません><
選択した部分のソースを表示
まずは以下にサンプルを。
↑でも紹介しているdp.SyntaxHighlighterを例に説明します。
実際の記述は以下の通り <pre name="code" class="javascript"> </pre>
まずはCtrl+Uでソースを覗いてみてください。
こんな表示になると思います。
では、↑の部分を選択し、右クリック「選択した部分のソースを表示」で見てみてください。
今度はこんな表示になると思います。
こんな感じの小ネタでした。
このエントリーのトラックバックURL:
- Web [56]
- スマートフォン [13]
- Android
- iPhone [13]
- デザインツール [12]
- Fireworks [3]
- Illustrator [1]
- Photoshop [6]
- パソコン [29]
- プログラミング [43]
- JavaScript [20]
- MovableType [22]
- PHP [8]
- 個人的ななにか [49]





