如何在没有浏览器渲染的情况下发布HTML代码

Question

我要为该项目构建一个论坛，但现在我面临这个问题，我希望用户能够发布他们的HTML源代码，因为它在此工作forum。

但问题是，代码从我的数据库检索时运行或分散我的设计。

我试着用在jQueryrepalce()但我只replace < with &lt;，但我希望有一个功能是能够取代其他如>,",'和&所以我的问题是我怎么可以更新此功能。

function convert(div){ 
    var str = $(div).html(); 
    var str2 = str.replace(/</g,"&lt;"); 
    var sta = $(div).html(str2); 
    return sta; 
} 

上面的代码工作，以取代<但是当我尝试包括功能将停止工作，我怎样才能使它发挥作用>,",'和&。

在此先感谢。

Answer 1

坚持在<pre>或<code>标签，或两者兼而有之，并确保你插入的内容时，标签

function convert(div){ 
 
    var str = $(div).html(); 
 
    var sta = $('<code />', {text : str}); 
 

 
    return sta; 
 
} 
 

 
var result = convert($('#test')); 
 

 
$('#result').html(result)

#result { 
 
    white-space : pre; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="test"> 
 
    <span> 
 
    <p>TEST</p> 
 
    </span> 
 
</div> 
 
<br /> 
 
<div id="result">

<code>将保留代码中使用text()，并且<pre>会保留空白，但也有CSS white-space属性，可以作为<pre>标记使用pre设置