如何以编程方式向段落标记添加换行符

Question

我想以编程方式将换行符应用于 dom 元素。

我尝试使用 <br>、<br/> 和 \n 来解决这个问题的不同答案。

但是，none 有效。

这是一个例子：

document.getElementById('1').textContent = "\n".repeat(6)
document.getElementById('2').textContent = "<br/>".repeat(6)

p {
  border: 1px solid black;
}

<h2>Set <code>\n</code></h2>
<p id="1"></p>

<h2>Set <code>&lt;br/&gt;</code></h2>
<p id="2"></p>

<br>、<br/>会出现在textContent中，但不应用换行符。

\n 没有出现在 textContent 中，也没有应用换行符。

有人知道如何解决这个问题吗？

Answer 1

编码

• textContent 将转义您传递的值。
• innerHTML 会将字符串保留为 html

空格

\n 将添加一个新行，但由于 html 与 whitepsace 无关，因此默认情况下它不会显示在 <p> 标记内。如果要加换行，可以用<br/>代替

堆栈片段中的演示

document.getElementById('1').textContent = "<br/>".repeat(6)
document.getElementById('2').innerHTML = "<br/>".repeat(6)

p {
  border: 1px solid black;
}

<h2>Set <code>textContent</code></h2>
<p id="1"></p>

<h2>Set <code>innerHTML</code></h2>
<p id="2"></p>