HOME

{ HTML ソースコードインデント整形 : javascript ( 関数 ) }

{ svg, javascript で作成したプログラム一覧 }

推奨 ブラウザ : chrome

{ HTML ソースコードの整形 }
{ 整形する HTML テキスト }

{ 実行結果 }

HTML のソースコードをインデントで見やすいように整形します。
テキストエリアに HTML のソースコードを貼り付け、
実行をクリックすれば、タグの階層に応じてインデントで
段落が付いたソースコードが出力されると思います。
script, style, pre, textarea タグの中身は、
整形されずに、入力のまま、出力されます。
クォーテーションで囲まれた文字列の中の、
タグ記号は無視するようにしています。
タグ内で改行がある場合は、改行を削除して、一行にまとめます。

テストしたソースコードは、 単純で、ボリュームも少ないものです。
なので、大きなサイズのコードは、実行しないほうがいいです。
サイズが小さくても、複雑なものでは、段落落ちをしたりすると思います。
また、 xml, タブインデントでのテストも行っていません。
他にも色々と。。。(*'ω' *)

要素のインライン、ブロックレベルの判定は、
終了タグの存在で判断しています。
なので、タグの末尾にタグ終了のスラッシュ記号があるインライン要素の場合、
きちんとインデント出来ないことが有ります。
sample コードの body タグは広告が挿入されてしまうので、
boody にしています。

2017-05-12 : タグ内に改行がある場合、インデント幅の選択など、調整。

数学の勉強をやり直ししてたりします。_´ω`)_