我正在尝试使用highlight.js 突出显示XML。
这里是示例 codepen link
但是我面临两个问题:
- 自闭合元素呈现为非自闭合标签,即上例中的作者元素。
- XML 编码属性也未得到渲染。
我尝试实现转义方法,用/> 替换“/>”,但它没有按预期方式工作。
示例:预期的 XML
<?xml version="1.0"?>
<catalog>
<book id="bk112">
<author id="1"/>
<title>Visual Studio 7: A Comprehensive Guide</title>
</book>
</catalog>
实际 XML
<catalog>
<book id="bk112">
<author id="1">
<title>Visual Studio 7: A Comprehensive Guide</title>
</author>
</book>
</catalog>
有没有办法纠正这种行为。
最佳答案
在这种情况下,code
标记会解析 HTML。为避免您可以使用 textarea
(function() {
var el = document.querySelector(".xml"),
pre = document.querySelector("pre");
pre.innerText = el.value;
hljs.highlightBlock(pre);
})();
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/vs.min.css" rel="stylesheet"/>
<div hidden>
<textarea class="xml">
<?xml version="1.0"?>
<catalog>
<book id="bk112">
<author id="1"/>
<title>Visual Studio 7: A Comprehensive Guide</title>
</book>
</catalog>
</textarea>
</div>
<pre></pre>
关于javascript - 无法使用highlight.js 以正确的顺序呈现 XML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59333061/