问

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

小虎发布于 2023-02-04 18:07

html

如果我从一个元素中获取一些html,然后尝试将其指定为另一个元素的文本内容,则不会保留换行符(至少不会保留最新的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/

应该有一些方法可以将一个元素的html设置为另一个元素的文本,同时正确保留换行符.

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

1 个回答

正如您已经确定的那样,Web浏览器通常不会将换行符渲染\n为换行符.如果您拒绝添加换行符元素<br />,则可以将white-spaceCSS属性与值一起使用,该属性pre-line将:

空白的序列被折叠.线条在换行字符,at处<br>和必要时用于填充线框.

在使用之前,请务必检查属性的兼容性表.
```
<div >
    Look

    at
    these line breaks!
</div>
```
这是一个JSFiddle示例.
2023-02-04 18:09 回答

mobiledu2502916503

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签