如何在 HTML 文档中显示 html 标签？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5406373/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I display html tags inside an HTML document?
提问by Ariel
I simply want to create something like that:
我只是想创建这样的东西：
<strong>blah blah</strong>
I've been trying to do this for a long time though for some reason whenever I put the code and the pre tags they don't do what they should. They do unformat the content - I don't see any formatting, though the tags don't appear. For example, I wrote :
我已经尝试这样做很长时间了，但出于某种原因，每当我放置代码和预标记时，他们都没有做他们应该做的事情。他们确实取消了内容的格式 - 虽然没有出现标签，但我没有看到任何格式。例如，我写道：
<pre><b>abc</b></pre>
The abc is appearing not bold, but I can't see the tag itself. How can I do that? I don't want to use entities like &fdaf; because I am not writing the incoming text
abc 看起来不是粗体，但我看不到标签本身。我怎样才能做到这一点？我不想使用像 &fdaf; 这样的实体。因为我不是在写传入的文本
采纳答案by metavida
Like mkluwe also said, you should use JavaScript (or a server-side script) to properly escape any user input. Here's another JavaScript function you could try:
就像 mkluwe 所说的那样，您应该使用 JavaScript（或服务器端脚本）来正确地转义任何用户输入。这是您可以尝试的另一个 JavaScript 函数：
String.prototype.escapeHTML = function () {
return(
this.replace(/>/g,'>').
replace(/</g,'<').
replace(/"/g,'"')
);
};
var codeEl = document.getElementById('test');
if (codeEl) {
codeEl.innerHTML = codeEl.innerHTML.escapeHTML();
}
I haven't tested this in IE, but it should work there in theory. Here's a page where you can view the results: http://jsbin.com/oruri5/2/edit
我还没有在 IE 中测试过这个，但理论上它应该在那里工作。这是您可以查看结果的页面：http: //jsbin.com/oruri5/2/edit
回答by Fuzzy Analysis
Use the <xmp>tag, e.g.
使用<xmp>标签，例如
<xmp>
<html>
<body>This is my html inside html.</body>
</html>
</xmp>
You can also add styles and formatting inside <xmp>as well.
您还可以在其中添加样式和格式<xmp>。
回答by Scoregraphic
How about replacing the incoming texts by <and >The tags should be visible in source view, but not "in normal view".
如何用<和替换传入的文本>标签应该在源代码视图中可见，但在“普通视图”中不可见。
回答by mkluwe
回答by silkcom
The easiest way I know is to replace the < and > with < and > that way it's not html anymore. There are several other codes like these for & symbols, etc.
我知道的最简单的方法是将 < 和 > 替换为 < 和 > 这样它就不再是 html 了。还有其他一些代码，例如 & 符号等。
Where is the text coming from? If it's in javascript than you're easiest way would be to do a regex replace in javascript.
文字从何而来？如果它是在 javascript 中，那么最简单的方法就是在 javascript 中进行正则表达式替换。
回答by Pete Wilson
You haveto write stuff like &fdaf; because the browser refuses to believe that you mean <pre> for everything. This is the correct behavior, else how would you ever escape from a <pre> section? You have to go through the doc and for every less-than sign substitute <. You do not have to do thatfor the greater-than sign or for ampersand (usually).
你必须写像 &fdaf; 这样的东西。因为浏览器拒绝相信你的意思是 <pre> 。这是正确的行为，否则你怎么会从 <pre> 部分逃脱？您必须仔细阅读文档，并对每个小于号替换 <。对于大于号或＆符号（通常），您不必这样做。
回答by Trp
Don't use <xmp>, <plaintext>and <listing>. Use as suggested by MDN:
不要使用<xmp>,<plaintext>和<listing>。按照MDN 的建议使用：
Use the
<pre>element or, if semantically adequate, the<code>element instead. Note that you will need to escape the<character as<to make sure it is not interpreted as markup.
使用
<pre>元素，或者，如果语义足够，使用<code>元素代替。请注意，您需要对<字符进行转义<以确保它不会被解释为标记。
回答by Michael Cole
to build on @mkluwe's answer, here is an example:
以@mkluwe 的回答为基础，这里有一个例子：
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> </script>
</head>
<body>
<pre>
<a href="http://localhost:3000/l/1/2/3" target="_blank">
<img src="http://localhost:3000/b/1/2/3/4" target="_blank">
</a>
</pre>
<script>
$( 'pre' ).text( $( 'pre' ).html() );
</script>
</body>
</html>
