[英]Display html code in html page
I've a contentEditable div, and I want to display the html script for the content of this div. 我有一个contentEditable div,我想显示该div内容的html脚本。 I'm using a bootbox alert to display my code, and the Rainbow Plugin to highlight the syntax. 我正在使用启动箱警报来显示我的代码,并使用Rainbow插件来突出显示语法。
The is the code I'm using : 这是我正在使用的代码:
bootbox.alert('<pre><code data-language="html">'+ document.getElementById('editor').innerHTML + '</code></pre>');
I also used the xmp
tag and this script: 我还使用了xmp
标签和以下脚本:
<pre><![CDATA[
This is a demo, tags like <p> will
appear literally.
]]></pre>
as shown in this article : How to display raw html code in PRE or something like it but without escaping it , but none of them has worked. 如本文所示: 如何在PRE或类似的格式中显示原始html代码,但不转义 ,但是它们都没有起作用。
This is what I'm getting : 这就是我得到的:
How can I solve this ? 我该如何解决?
Use entities, like 使用实体,例如
var encodeHtmlEntity = function(str) {
var buf = [];
for (var i=str.length-1;i>=0;i--) {
buf.unshift(['&#', str[i].charCodeAt(), ';'].join(''));
}
return buf.join('');
};
bootbox.alert('<pre><code data-language="html">'+ encodeHtmlEntity(document.getElementById('editor').innerHTML)) + '</code></pre>');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.