如何在网页上显示HTML片段,而不需要将每个<替换为<>和>?
换句话说,是否有一个标记表示在点击结束标记之前不呈现HTML ?
如何在网页上显示HTML片段,而不需要将每个<替换为<>和>?
换句话说,是否有一个标记表示在点击结束标记之前不呈现HTML ?
当前回答
<textarea ><?php echo htmlentities($page_html); ?></textarea>
对我来说很好。
“记住亚历山大的建议,这就是为什么我认为这是一个很好的方法”
如果我们只是尝试朴素的<textarea>,它可能并不总是工作,因为可能会关闭textarea标签,这可能会错误地关闭父标签,并在父文档上显示HTML源代码的其余部分,这看起来很尴尬。
使用htmlentities将所有适用的字符(如< >)转换为HTML实体,从而消除了任何泄漏的可能性。
这种方法可能有好处或缺点,也可能有更好的方法来实现相同的结果,如果是这样,请评论,因为我很想从中学习:)
其他回答
示例1:
<pre>
This text has
been formatted using
the HTML pre tag. The brower should
display all white space
as it was entered.
</pre>
示例2:
<pre>
<code>
My pre-formatted code
here.
</code>
</pre>
示例3: (如果你实际上是在“引用”一段代码,那么标记应该是)
<blockquote>
<pre>
<code>
My pre-formatted "quoted" code here.
</code>
</pre>
</blockquote>
它可能并不适用于所有情况,但将代码片段放在文本区域内将它们显示为代码。
如果你不想让它看起来像一个实际的文本区域,你可以用CSS样式文本区域。
已弃用,但适用于FF3和IE8。
<xmp>
<b>bold</b><ul><li>list item</li></ul>
</xmp>
推荐:
<pre><code>
code here, escape it yourself.
</code></pre>
在HTML中有几种方法可以转义所有内容,但都不是很好。
或者你可以放入一个iframe来加载一个普通的旧文本文件。
如果你的目标是显示你在同一页面的其他地方执行的代码块,你可以使用textContent(它是纯js和良好的支持:http://caniuse.com/#feat=textcontent)
<div id="myCode">
<p>
hello world
</p>
</div>
<div id="loadHere"></div>
document.getElementById("myCode").textContent = document.getElementById("loadHere").innerHTML;
要在结果中获得多行格式,您需要在目标div上设置css样式“white-space: pre;”,并在每一行的末尾使用“\r\n”单独写入行。
这里是一个演示:https://jsfiddle.net/wphps3od/
与使用textarea相比,这种方法有一个优点:代码不会像在textarea中那样重新格式化。(比如 在文本区域中完全删除)