コード整形ツール
HTMLコードを自動で改行、インデント設定をして見やすくするJavaScriptによるHTMLコードフォーマッター(Code formatter)です。(コメントアウトは対象外)
※注意:一般的なHTMLコードに適しています(整形が不完全な部分もあるとおもいます...)
- inputに整形したいHTMLコードを入力(貼り付け)します。(初期表示のテキストはサンプルです。)
- outputに整形されたHTMLコードが表示されます。
input
output
コード
コードを整形するためのコード(関数)です。引数にHTMLコード(文字列)を指定して呼び出すことで、返り値に整形されたコード(文字列)が渡されます。
format(code) {
code = code.replace("\n", "");
var indent = "", before;
function replacer(tag, space, p1, index, str) {
if (space) {
tag = tag.replace(space, "");
}
if (!tag.match("\/")) {
if (index > 0) {
tag = "\n" + indent + tag;
}
indent = indent + " ";
} else {
indent = indent.slice(0, indent.length - 4);
if (!tag.match(before) && !before.match("\/")) {
indent = indent.slice(0, indent.length - 4);
}
if (!tag.match(before) || before.match("\/")) {
tag = "\n" + indent + tag;
}
}
before = p1.replace(">" && " ", "");
return tag
}
code = code.replace(/([\s]*)<([\w]*?>|\/[\w]*?>|[\w]* |\/[\w]* )/g, replacer)
return code
}
関連記事