如果我从一个元素中获取一些 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/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)