Wie kann ich HTML in JavaScript formatieren / aufräumen / verschönern?Ich habe versucht, nach spitzen Klammern zu suchen / zu ersetzen <, >) und entsprechend einrücken. Aber natürlich wird nicht berücksichtigt, wann sich JS oder CSS usw. im HTML befinden.

Der Grund, warum ich dies tun möchte, ist, dass ich einen Inhaltseditor (CMS) erstellt habe, der sowohl WYSIWYG- als auch Quellcodeansichten enthält. Das Problem, das der vom WYSIWYG-Editor geschriebene Code verursacht, ist normalerweise eine einzelne Zeile. Deshalb hätte ich gerne ein JavaScript, das dies bei Bedarf in eine besser lesbare Form bringen könnte.

Hier was ich bisher habe:

function getIndent(level) {
    var result = '',
        i = level * 4;
    if (level < 0) {
        throw "Level is below 0";
    }
    while (i--) {
        result += ' ';
    }
    return result;
}

function style_html(html) {
    html = html.trim();
    var result = '',
        indentLevel = 0,
        tokens = html.split(/</);
    for (var i = 0, l = tokens.length; i < l; i++) {
        var parts = tokens[i].split(/>/);
        if (parts.length === 2) {
            if (tokens[i][0] === '/') {
                indentLevel--;
            }
            result += getIndent(indentLevel);
            if (tokens[i][0] !== '/') {
                indentLevel++;
            }

            if (i > 0) {
                result += '<';
            }

            result += parts[0].trim() + ">\n";
            if (parts[1].trim() !== '') {
                result += getIndent(indentLevel) + parts[1].trim().replace(/\s+/g, ' ') + "\n";
            }

            if (parts[0].match(/^(img|hr|br)/)) {
                indentLevel--;
            }
        } else {
            result += getIndent(indentLevel) + parts[0] + "\n";
        }
    }
    return result;
}