>_toolkitbox

~/tools / HTML Formatter

HTML Formatter

HTMLをインデント付きで整形します。ブラウザ標準のDOMParserで解析するため、実際のブラウザの解釈に近い形で整形されます。

ミニファイされた/1行に詰まったHTMLソースを確認したいときや、テンプレートエンジンの出力を見やすく整えたいときに使います。実際のブラウザと同じパーサーで解釈するため、崩れたHTMLでもある程度は解釈されます。

# こんな時に使う

  • テンプレートエンジンやSSRが出力した1行のHTMLを確認したいとき
  • ミニファイされたHTMLソースを読んで構造を把握したいとき
  • 閉じタグ漏れなど崩れたHTMLが、ブラウザにどう解釈されるか確認したいとき

# 使い方

  1. 整形したいHTMLをテキストエリアに貼り付けます。
  2. 「整形する」を押すと、インデント付きの読みやすい形で表示されます。

# FAQ

壊れたHTML(閉じタグ忘れ等)も整形できますか?
はい。ブラウザのHTMLパーサーはXMLと違ってエラーを出さず、可能な限り解釈しようとします。ただし、意図しない構造になる場合があるため、結果は確認してください。
<script>や<style>の中身も整形されますか?
内部のJavaScript/CSSコードそのものは再整形せず、テキストとしてそのまま出力します。

# Related

# 姉妹サイトで学ぶ