我的innerHTML的结果类似于下面的javascript。
"<ol><li>Testing1</li><li>Testing2</li></ol>"
我可以使用正则表达式或其他格式将其对齐为以下代码格式吗?有什么建议吗?
<ol>
<li>Testing1</li>
<li>Testing2</li>
</ol>
答案 0 :(得分:3)
问题isn't trivial。正则表达式的一个问题是,在大多数情况下,Javascript无法处理嵌套的匹配定界符。另一个问题是,您需要跟踪自动关闭标签(<div class="box box-primary">
<div class="box-body">
<div class="row">
<div class="col-md-6">
<dl class="dl-horizontal">
<dt>Nama Produk</dt>
<dd> {{ ucfirst($product ?? '') }}</dd>
<dt>Harga Produk</dt>
<dd> {{ "Rp. ". number_format($product ?? '',0,'.','.') }}</dd>
<dt>Stok Produk</dt>
<dd> <label for="" class="text text-primary"> {{ $product ?? ''->stock }} </label></dd>
{{-- <dt>Description</dt>
<dd style="word-break: break-all;"> {{ str_limit($product ?? ''->description,500,' ...') }}</dd> --}}
</dl>
</div>
</div>
或没有关闭标签的标签(<div />
,<img>
)和以编程方式确定您当前正在处理的文本是结构化HTML标记的一部分,还是纯文本(例如<input>
)。
使用为此目的而设计的库可能会更容易,以免重新发明轮子。 js-beautify是一种选择:
<textarea>foo<div>bar</div></textarea>
const input = "<ol><li>Testing1</li><li>Testing2</li></ol>";
console.log(html_beautify(input, { 'indent-size': 2 }));