在html页面中显示html代码

Question

我有一个contentEditable div，并且我想显示该div的内容的html脚本。 我正在使用bootbox提醒显示我的代码，并使用Rainbow插件突出显示语法。

的是我使用的代码：我还使用了xmp标签

bootbox.alert('<pre><code data-language="html">'+ document.getElementById('editor').innerHTML + '</code></pre>'); 

与此脚本：

<pre><![CDATA[ 
This is a demo, tags like <p> will 
appear literally. 
]]></pre> 

在这篇文章中表示：How to display raw html code in PRE or something like it but without escaping it，但他们都没有工作。

这就是我得到：

我该如何解决这个问题？

Answer 1

使用单位，像

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>');