在 html 内容中显示 html 标签，在 html 中显示 html 代码片段

Question

我想知道是否有一种方法可以将htmlentities()应用于var x以便如果我将<p>hello</p>放入text area并按下按钮，它将显示<p>hello</p>使用下面的代码你好。

提前致谢

 function myFunction1() { var x = document.getElementById("myText1").value; document.getElementById("demo1").innerHTML = x; }

 <textarea name="myText" id="myText1" type="text"></textarea> <button onclick="myFunction1()">thing</button> <p><span id="demo1"></span></p>

Answer 1

您需要使用<xmp>标签

 <xmp> <p>hello</p> </xmp>

 function myFunction1() { var x = document.getElementById("myText1").value; document.getElementById("demo1").innerHTML = x; }

 <textarea name="myText" id="myText1" type="text"></textarea> <button onclick="myFunction1()">Show</button> <p><xmp id="demo1"></xmp></p>

Answer 2

通常，这是通过将<符号替换为“小于”HTML 编码 ( < )，并将>替换为“大于”( > ) 来完成的。

例如，您应该使用基本的字符串方法来替换类似

"<p>hello</p>"

和

"<p>hello</p>"

（否则，将其添加到元素的 innerHTML 会将其读取为 HTML，包括标签。）

我应该指出，您也可以尝试将所有内容都包装在<pre>标签中，但我已经得到了不同的结果。 我认为上面的方法是一个更安全的赌注。