如何将代码显示为纯文本答案

【问题标题】：How do I display the code as plain text如何将代码显示为纯文本
【发布时间】：2016-06-11 08:30:41
【问题描述】：

这是我的代码：

<!DOCTYPE html>
<html>
    <head>
        <p id="x"></p>
        <p id="y"></p>
        <style>
        </style>
    </head>
    <body>
        <button id="btn">Click Me!</button>
        <script src="jquery/jquery1.12.js"></script>
        <script>
            var txt = '<!DOCTYPE html>\
                       <html>\
                       <head>\ 
                       </head>\
                       <body>\
                       <script>\
                       alert("ok");\
                       </script>\
                       </body>\
                       </html>';

           $(document).ready(function(){
               $("#btn").click(function(){
                   $("#x").text(txt);
               })
           })
        </script>
    </body>
</html>

如何将代码显示为纯文本。例如，我希望每行变量 x 转到新行：

输出为：

<!DOCTYPE html>
<html>
<head>
up to the end

任何帮助，tankyou。

【问题讨论】：

标签： javascript

【解决方案1】：

在您的#x 元素中，您应该使用pre 元素而不是p。

另外，您应该将其从 head 移至 body

查看这个 JSBin：http://jsbin.com/qicabanoze/edit?html,js,output

【讨论】：

这是 ES6 模板字面量

【解决方案2】：

为防止代码执行而不显示，您需要将文本转换为字符实体。 > 变为 &gt，，等等。

您还可以使用<pre> 和<code> 标签来显示格式化代码。

【讨论】：

【解决方案3】：

您应该将符号 '' 替换为 &lt; 和 &gt; 它会起作用的。

您可以使用<code> 或<pre>，但对于最后一个，您需要更改文本样式（默认字体）。

【讨论】：

Tankyou 使用标签代码时，所有标签都在一行我希望每一行都在新行中。
请查看此链接：stackoverflow.com/questions/1011641/…