在 <p> 标签中换行

Question

我尝试在 <p> （html 代码）中添加一个新行：

 <p id="text_folder"><p>

这是我的 jquery 代码：

 $('#text_folder').text("first"+"\n"+"second");

但在我的 <p> 标签中，结果是

第一秒

并不是：

第一的

第二

任何人都可以帮助我吗？

原文由 Polly 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

('#text_folder').html("first"+"<br />"+"second")

尝试这个

原文由 Chetan Sanghani 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

在 HTML 中，所有空白字符（包括换行符）都被解释为空格。要在 p 元素中放置换行符，您可以使用 br 元素：

 $("#text_folder").html("first<br>second");

如果您的“第一”和“第二”是外部来源（来自用户等），您需要确保首先处理其中的任何特殊 HTML 字符。有几种方法可以做到这一点；我发现 replace 其中最简单的一个：

 function escapeHTML(str) {
    return str.replace(/&/g, "&amp;").replace(/</g, "&lt;");
}

那么

var first = /*...get input from user or whatever...*/;
var second = /*...get input from user or whatever...*/;
$("#text_folder").html(escapeHTML(first) + "<br>" + escapeHTML(second));

原文由 T.J. Crowder 发布，翻译遵循 CC BY-SA 3.0 许可协议