javascript - 从 XMLSerializer().serializeToString 格式化输出字符串

Question

我正在使用以下调用来获取部分 DOM 的 XML 代码。

var sXML = new XMLSerializer().serializeToString(document.getElementsByTagName("TopElementTag")[0]);

但是，当我显示这个字符串时，它都是一行。

有没有办法格式化这个字符串，使其具有换行符和制表符，使其易于人类阅读？

Answer 1

我将vkBeutify与以下代码一起使用。

var sXML = new XMLSerializer().serializeToString(document.getElementsByTagName("TopElementTag")[0]);
sXML = vkbeautify.xml(sXML);

Answer 2

这个迷你库可以在小于 1kb 的未压缩时美化和缩小。

https://gist.github.com/max-pub/a5c15b7831bbfaba7ad13acefc3d0781

https://codepen.io/maxpub/pen/qBWPJEL?editors=1010

XML = {
    parse: (string, type = 'text/xml') => new DOMParser().parseFromString(string, type),  // like JSON.parse
    stringify: DOM => new XMLSerializer().serializeToString(DOM),                         // like JSON.stringify

    transform: (xml, xsl) => {
        let proc = new XSLTProcessor();
        proc.importStylesheet(typeof xsl == 'string' ? XML.parse(xsl) : xsl);
        let output = proc.transformToFragment(typeof xml == 'string' ? XML.parse(xml) : xml, document);
        return typeof xml == 'string' ? XML.stringify(output) : output; // if source was string then stringify response, else return object
    },

    minify: node => XML.toString(node, false),
    prettify: node => XML.toString(node, true),
    toString: (node, pretty, level = 0, singleton = false) => { 
        if (typeof node == 'string') node = XML.parse(node);
        let tabs = pretty ? Array(level + 1).fill('').join('\t') : '';
        let newLine = pretty ? '\n' : '';
        if (node.nodeType == 3) return (singleton ? '' : tabs) + node.textContent.trim() + (singleton ? '' : newLine)
        if (!node.tagName) return XML.toString(node.firstChild, pretty);
        let output = tabs + `<${node.tagName}`; // >\n
        for (let i = 0; i < node.attributes.length; i++)
            output += ` ${node.attributes[i].name}="${node.attributes[i].value}"`;
        if (node.childNodes.length == 0) return output + ' />' + newLine;
        else output += '>';
        let onlyOneTextChild = ((node.childNodes.length == 1) && (node.childNodes[0].nodeType == 3));
        if (!onlyOneTextChild) output += newLine;
        for (let i = 0; i < node.childNodes.length; i++)
            output += XML.toString(node.childNodes[i], pretty, level + 1, onlyOneTextChild);
        return output + (onlyOneTextChild ? '' : tabs) + `</${node.tagName}>` + newLine;
    }
}