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

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


当前回答

在HTML ?不。

在XML / XHTML吗?您可以使用CDATA块。

其他回答

JavaScript字符串文字可以用于跨多行编写HTML。显然,这个解决方案需要JavaScript,特别是ECMA6。

.createTextNode with CSS white-space: pre-wrap;很管用。

. innertext单独也可以。运行下面的代码片段。

let codeBlock = ` <!DOCTYPE HTML> <html lang="en"> <head> <title>My Page</title> </head> <body> <h1>Welcome to my page</h1> <p>I like cars and lorries and have a big Jeep!</p> <h2>Where I live</h2> <p>I live in a small hut on a mountain!</p> </body> </html> ` const codeElement = document.querySelector("#a"); let textNode = document.createTextNode(codeBlock); codeElement.appendChild(textNode); const divElement = document.querySelector("#b"); divElement.innerText = codeBlock; #a { white-space: pre-wrap; } <div id=a> </div> <div id=b> </div>

行之有效的HTML方法:

将&字符替换为& 将<字符替换为&lt; 将>字符替换为&gt; 可以选择用<pre>和/或<code>标记包围HTML示例。

您可以通过将标记更改为span来分隔它们。

是这样的:

< span > < < / span > < !- h1的左括号-> < span > h1 > < / span > < !——h1的开始标签在这里完成——> < span > < / span > <你好!——text to print——> < span > < < / span > < !——h1标签的括号在这里——> < span > / h1 > < / span > < !——h1标签结束于此——>

而且,你可以只把<(左尖括号)加到span上

< span > < < / span > < !- h1的左括号-> h1 > < !——h1的开始标签在这里完成——> 你好< !——text to print——> < span > < < / span > < !——h1标签的括号在这里——> / h1 > < !——h1标签结束于此——>

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

    <xmp id="container">

&lt;xmp &gt;

    <p>a paragraph</p>

    &lt;/xmp &gt;

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

对我来说很好。

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

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

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

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