如何在网页上显示HTML片段,而不需要将每个<替换为&lt;>和&gt;?

换句话说,是否有一个标记表示在点击结束标记之前不呈现HTML ?


当前回答

<textarea ><?php echo htmlentities($page_html); ?></textarea>

对我来说很好。

“记住亚历山大的建议,这就是为什么我认为这是一个很好的方法”

如果我们只是尝试朴素的<textarea>,它可能并不总是工作,因为可能会关闭textarea标签,这可能会错误地关闭父标签,并在父文档上显示HTML源代码的其余部分,这看起来很尴尬。

使用htmlentities将所有适用的字符(如< >)转换为HTML实体,从而消除了任何泄漏的可能性。

这种方法可能有好处或缺点,也可能有更好的方法来实现相同的结果,如果是这样,请评论,因为我很想从中学习:)

其他回答

 //To show xml tags in table columns you will have to encode the tags first

function htmlEncode(value) {
    //create a in-memory div, set it's inner text(which jQuery automatically encodes)
    //then grab the encoded contents back out.  The div never exists on the page.
    return $('<div/>').text(value).html();
}

html = htmlEncode(html)

这是目前为止在大多数情况下最好的方法:

<pre><code>
    code here, escape it yourself.
</code></pre>

我会投票给第一个提出这个建议的人,但我没有名气。为了那些试图在网上找到答案的人,我不得不说些什么。

已废弃的<xmp>标记实际上就是这样做的,但它不再是XHTML规范的一部分。尽管它在当前所有浏览器中仍然有效。

这里有另一个想法,一个hack/parlor trick,你可以把代码放在一个文本区域,像这样:

<textarea disabled="true" style="border: none;background-color:white;">
    <p>test</p>
</textarea>

将尖括号和这样的代码放在文本区域内是无效的HTML,在不同的浏览器中会导致未定义的行为。在Internet Explorer中,HTML是解释的,而Mozilla、Chrome和Safari则不解释。

如果你想要它是不可编辑的,看起来不同,那么你可以很容易地使用CSS样式。唯一的问题是浏览器会在右下角添加一个小的拖动句柄来调整方框的大小。或者,尝试使用input标记。

正确的方式注入代码到你的文本区域是使用服务器端语言,比如PHP:

<textarea disabled="true" style="border: none;background-color:white;">
    <?php echo '<p>test</p>'; ?>
</textarea>

然后,它绕过html解释器,并在所有浏览器中一致地将未解释的文本放入文本区域。

除此之外,如果使用静态HTML,唯一的方法是自己转义代码,如果使用这种技术,则使用服务器端方法,如。net的HtmlEncode()。

很简单.... 使用此xmp代码

    <xmp id="container">

&lt;xmp &gt;

    <p>a paragraph</p>

    &lt;/xmp &gt;

</xmp>

已弃用,但适用于FF3和IE8。

<xmp>
   <b>bold</b><ul><li>list item</li></ul>
</xmp>

推荐:

<pre><code>
    code here, escape it yourself.
</code></pre>