通过JavaScript显示HTML层次结构

Question

我有任务：采取连续文本（HTML），并提供文本像标准的HTML在<pre>标记与所需的缩进。我怎样才能做到这一点？

实施例：

<!-- From --> 
`<div><p>Hello World</p><ul><li>Item 1</li><li>Item 2</li><li>Item 3</li></ul></div>` 

<!-- To --> 
`<div> 
    <p>Hello World</p> 
    <ul> 
     <li>Item 1</li> 
     <li>Item 2</li> 
     <li>Item 3</li> 
    </ul> 
</div>` 

P.S.我有真正的文本资源，并通过插入$(elemen).find('pre').text(result)

Answer 1

1）Try js-beautify

这是一个JS美化的结果，但对于HTML工作过。

2）prettydiff