jquery - 在模态窗口中显示 html 文本(不解析)

Question

我正在制作一个带有 HTML 和 CSS 微调器和加载器示例的小网站。当我们单击其中一个示例时，将打开一个模式窗口。我想在此模式窗口上显示该特定微调器的 HTML 和 CSS 代码，以便人们可以复制它并将其用于他们的元素。

我正在使用 jQuery 中的 .load() 为每个微调器/模态窗口加载正确的“文本”，如下所示:

$(".htmlcode").load("content/" + fileName + ".html");

这是加载正确的文件和 html 数据。

问题是 HTML 正在解析，因此 os 显示“html 文本”而不​​是再次显示动画。

执行此操作的最佳方法是什么？

还有另一个具有类似功能的网站:http://projects.lukehaas.me/css-loaders/

谢谢

Answer 1

很难看出您是如何加载内容的 - 最好创建一个 <textarea>模态窗口中的组件，然后将文本区域的内容设置为 html/css 的内容。

那样的话，它就会被转义。

    function copy() {
document.getElementById("myTextAreaID").value = document.getElementById("myhtml").innerHTML;
}

这里是粗略的工作示例:

https://jsfiddle.net/825osa3d/

编辑:进一步扩大概念，将元素的 HTML 转换为字符代码，然后将其插入 DIV

https://jsfiddle.net/2fubppkp/3/