JavaScript字符串拼接设置textContent时 无法换行的问题咨询

textContent里写入的\n确实会被存入为文本换行符，但普通HTML元素默认的渲染规则会把所有连续空白字符（包括换行、多空格、制表符）折叠为单个空格，因此视觉上看不到换行效果，并非换行符没有被写入节点。

你可以根据自己的代码场景二选一：

• 最小改动方案：给对应的node节点添加CSS属性white-space: pre-line
  该属性会让浏览器保留文本内容中的换行符，同时正常折叠多余空白、支持文本自动折行，完全适配你当前的写法，不需要修改JS逻辑。参考CSS代码：

  .result-node {
    white-space: pre-line;
  }
  

• 替换写入方式：改用innerHTML搭配HTML换行标签<br>
  如果不想调整CSS，可以直接把文本里的\n换成HTML原生换行标签，注意如果拼接的内容包含用户输入的不可信内容，要先做转义避免XSS风险。修改后的JS参考：

  node.innerHTML = "You lost!<br>";
  node.innerHTML += `${input.textContent} loses to ${convertNumber(computerSelection)}`;
  

内容的提问来源于stack exchange，提问作者Lorenzo Zabot