ホーム > ブラウザ > ブラウザでページソースの表示方法

ブラウザでページソースの表示方法

2008 年 3 月 19 日


ブラウザでページソースの表示方法

Internet Explorer 、FireFoxでのソースのいくつかの表示方法。
作成したページがうまく表示されない、ページ内の画像が欲しいなどソースを調べたい事ってよくありますよね。
そんな時、右クリックできなくされたページや動的に作成されたソースを見たい時に役立ちます。
JavaScriptで動的に要素を作成したものを確認する必要があって、調べてみました。

IEでのページソース表示方法

  1. メニュー 表示>ソース
  2. 右クリックからソースの表示
  3. 上記2つと同じ働きをする、ブックマークレット(XP SP2では機能しない)
     javascript:(function(){window.open('view-source:'+window.location)})(); 
  4. ソースをそのまま表示(インデントナシ)
     javascript:(function(){document.body.innerHTML=document.body.innerHTML.split('< ').join('&lt;')})();
  5. ソースをインデントなどを元のまま表示
     javascript:(function(){document.body.innerHTML="<plaintext>"+document.all.tags("HTML")[0].outerHTML})();
  6. JavaScriptなどで動的に生成されたソースも表示(これは便利)
    javascript:'<xmp>'+window.document.documentElement.outerHTML+'</xmp>';

FireFoxでのページソース表示方法

  1. メニュー 表示>ページのソース
  2. 右クリックからページのソースを表示
  3. ソースを表示したい部分を選択して、右クリックから選択した部分のソースを表示(動的に生成されたソースも表示されます。)

関連するエントリー

    None Found

ブラウザ , ,

  1. コメントはまだありません。
  1. トラックバックはまだありません。