如何使用 javascript 在 html 元素中创建新行

Question

我想在“ P”元素中创建一个新线路。我也尝试过BR标签和\ n标签，但它并没有真正起作用。当我运行代码时，新行显示为行之间的空间。

<p id="log"></p>

let log = document.getElementById("log");
let string = `|line1\n|line2`;
let array1 = string.split("|");
let i = 0;
let x = 0;
log.addEventListener("click", () => {
  document.addEventListener("keypress", type);
})

function type() {
  log.textContent += array1[i].charAt(x);
  x++;
  if (x === array1[i].length) {
    x = 0;
    i++;
  }
  if (array1[i] === undefined) {
    document.removeEventListener("keypress", type);
  }
}

Answer 1

因为您要在加载HTML之前尝试获取元素，因此日志变量是代码中的null。

请尝试此代码。

<p id="log>hello</p>

window.onload = function init() {
  const log = document.getElementById("log");
  log.innerText = "\n first \n second";
};