为什么console.log 和document.write 输出不同的结果?

问题描述

我有以下代码

let size = 8;
let board = "";

for (let y = 0; y < size; y++) {
  for (let x = 0; x < size; x++) {
    if ((x + y) % 2 == 0) {
      board += " ";
    } else {
      board += "#";
    }    
  }
  board += "\n";
}

console.log(board);
document.write(board);
<h1 style="text-align: center; color: rebeccapurple;">Chess Board</h1>

console.log 输出

enter image description here

document.write 输出

# # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #

为什么他们输出不同的结果?

解决方法

文档解释 html。 " " 和 "\n" 不是 HTML 代码。 你应该使用 "&nbsp;""<br/>" 而不是 " " 和 "\n"

for (let y = 0; y < size; y++) {
  for (let x = 0; x < size; x++) {
    if ((x + y) % 2 == 0) {
      board += "&nbsp;";
    } else {
      board += "#";
    }    
  }
  board += "<br/>";
}