换行符不适用于 jQuery .text()

Question

我有以下代码：-

function data(x) {
     var dataList = "";
     for (var key in obj) {
          dataList += key + ": " + obj[key] + "\n"
     }
     $('#modalText').text(dataList);
     document.getElementById('dataModal').style.display='block';
}

它会像这样填充 HTML：

<p id="dataList"></p>

虽然我在循环的每次迭代中都有一个“\n”连接到我的字符串，但我无法在每个 key/value 对之后显示换行符以显示在我的模式中。我还尝试了 jQuery .append() 函数而不是 .text()，但无济于事。

我的变量 dataList 在控制台中以适当的换行符打印，如下所示：

key: 123
time: 12:00
department: taxes

但是在模态打印的时候，没有换行：

key: 123 time: 12:00 department: taxes

如何让它在我的模式中显示，并在每个键值对后换行，如控制台中所示？

Answer 1

空格在 HTML 中没有任何意义。您需要使用 <br/> 并设置 .html()，或者您需要将 white-space: pre 添加到数据列表 <p> 标记。使用 pre 或 pre-wrap 将尊重空白（因此 \n 字符）

Answer 2

只需 <br> 就足以换行，而不是 "/n"，如下面的代码所示。

 function data(x) {
 var dataList = "";
 for (var key in obj) {
      dataList += key + ": " + obj[key] + "<br>"
 }
 $('#modalText').text(dataList);
 document.getElementById('dataModal').style.display='block';

}

换行符不适用于 jQuery .text()

Line break not working with jQuery .text()

javascript

jquery

loops

line-breaks

key-value