示例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>

我是这样做的:

$str = file_get_contents("my-code-file.php");
echo "<textarea disabled='true' style='border: none;background-color:white;'>";
echo $str;
echo "</textarea>";

在HTML ?不。

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

行之有效的HTML方法:

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

我很久以前用过这个，它对我很有用，我希望它也能帮助到你。

var preTag = document.querySelectorAll（'pre'）; console.log（preTag.innerHTML）; for （var i = 0; i < preTag.length; i++） { var pattern = preTag[i].innerHTML; pattern = pattern.replace（/&lt;/g， “&lt;”）.replace（/&gt;/g， “&gt;”）; 控制台.log（模式）; preTag[i].innerHTML = pattern; } <pre> <p>例</p> <span>更多文字</span> </pre>

如果你的目标是显示你在同一页面的其他地方执行的代码块，你可以使用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中那样重新格式化。(比如&nbsp;在文本区域中完全删除)