web-dev-qa-db-ja.com

Firefoxで自動フォーマットされたHTMLソースを表示することは可能ですか？

私はPHPでWebサイトを書いていますが、それがレンダリングするHTMLは適切にフォーマットされておらず、Firefoxでは読みにくいです（ほとんどが1行になっています）。

空白のフォーマットをたくさん追加してPHPコードを台無しにしたくないので、Firefoxにオプションやアドオンを追加できるかどうか疑問に思いました。 HTMLの構造に従ってインデントされたソースを表示する機能。

firefoxbrowser-addonsformattinghtml
10
Willbill

ソースチャートを見る2.7

正常に動作します。ここから拡張機能をインストールしてください： https://addons.mozilla.org/en-US/firefox/addon/655/

右クリック->ソースチャートを表示

これは私がGoogleホームページのHTMLソースで得たものです：

前：

alt text

後：

alt text

11
user3864

から ここ

ソースチャートの表示 ソース構造をグラフィカルに表示します。

alt text

JSView 2.0.5 ページの外部ファイルに情報を表示します。

alt text

HighlightAll コード内の同一の要素を強調表示します。

alt text

Html Validator 現在のページのHTMLを検証します。

alt text

フォーマットされたソースの表示 ソース構造を表示します。

alt text

SourceEditor コードを編集して結果を表示できます。

alt text

5
joe

私は通常、html出力のデバッグに Firebug を使用します。

これにより、Firebugで適切にフォーマットされたソースとともに、ブラウザーによってレンダリングされたHTMLを取得できます。表示されたhtmlの要素を調べて、元のhtmlソースのどこから来たのかを確認することもできます。

3
harrymc

2019年に同じ機能を探している人がいる場合は、FirefoxQuantum用のFireSource Viewer [1]があり、JavaScriptが操作した後に美化されたHTML DOMを表示します。これは、Webサーバーによって提供されるhtmlソースのみを使用するよりも優れています。

[1] https://addons.mozilla.org/en-US/firefox/addon/fire-source-viewer/

1
dasj19

Web開発者プラグイン：

Web Developer拡張機能は、さまざまなWeb開発者ツールをブラウザーに追加します。拡張機能はChromeおよびFirefoxで利用可能であり、Windows、OS X、Linuxなど、これらのブラウザがサポートするすべてのプラットフォームで実行されます

enter image description here

0
Angelo