使用“.text”或“.textContent”时保留换行符。可能的？备择方案？解决方法？

如果我从一个元素中获取一些 html，然后尝试将其分配为另一个元素的文本内容，则换行符是not保留（至少在最新的 Firefox 和 Chromium 中没有）。

因此，例如，以下代码（使用合理的 html）会生成其中换行符被空格替换的输出。好吧，除了警报，它按预期工作。

$("#info").data("html", $("#info").html());
$("#jquery").text($("#info").data("html"));
document.getElementById("javascript").textContent = $("#info").data("html");
$("#alert").click(function() { alert($("#info").data("html")) });

这是一个运行示例：http://jsfiddle.net/76S7z/2/ http://jsfiddle.net/76S7z/2/

应该有某种方法将一个元素的 html 设置为另一个元素的文本，同时正确保留换行符。

这可以用“text”或“textContent”吗？有没有其他方法可以做到这一点？有一个简单的解决方法吗？一个不太简单的解决方法？

正如您已经确定的，Web 浏览器通常不会呈现换行符\n作为换行符。如果您拒绝添加换行元素<br /> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br，您可以使用white-space https://developer.mozilla.org/en-US/docs/Web/CSS/white-spaceCSS 属性及其值pre-line，这将：

空白序列被折叠。换行符处断行，位于<br>，并根据需要填充行框。

使用前请务必检查该属性的兼容性表。

<div style="white-space: pre-line;">
    Look

    at
    these line breaks!
</div>

这是一个 JSFiddle 示例。 http://jsfiddle.net/8Y8uK/