如何将 html 作为字符串输出到屏幕？答案

【问题标题】：how can i output to screen html as string?如何将 html 作为字符串输出到屏幕？
【发布时间】：2016-05-19 21:58:01
【问题描述】：

我最近开始学习 Java Script。我想使用document.write() 并将html代码输出为字符串而不实际运行代码（只是在屏幕上显示）。

有什么功能可以帮助我做到这一点吗？

注意：我正在尝试使用 Java Script（不是 jQuery）

【问题讨论】：

请在以下线程中查看 ErikE 对此事的回答：stackoverflow.com/questions/6221067/…

标签： javascript

【解决方案1】：

不要使用document.write()；这是 20 世纪动态构建 DOM 的方式。而是将字符串放在您在初始 HTML 中创建的元素的 textContent 中。

var string = "<p>hi</p>";
document.getElementById("output").textContent = string;

&lt;div id="output"&gt;&lt;/div&gt;

另一种方法是创建一个文本节点并将其附加到 DOM。

var string = "<p>Hi</p>";
var node = document.createTextNode(string);
document.body.appendChild(node);

【讨论】：

【解决方案2】：

我建议您将替换为 <和>。

var string = '<html><p>hi</p></html>';
string = string.replace(/</g, "&lt;");
string = string.replace(/>/g, "&gt;");
document.write(string);

http://codepen.io/calvinclaus/pen/eZwGmX?editors=1010

【讨论】：

【解决方案3】：

要添加@Calvin Claus 的答案，您还应该将'&' 换成'&amp;' 并将整个字符串包装在<pre> 和</pre> 标签中以消除空格。请注意，通常您不应该使用document.write()，而是更改 DOM 中元素的 textContent 属性（此处可能是 div），并且您不需要转义 HTML 标记。

【讨论】：