如何让JavaScript MsgWindow中document.write输出实现换行？

嘿，这个坑我踩过！你遇到的问题核心在于：HTML文档里默认不会把\n这种换行符渲染成换行——浏览器只会把它当成普通空格处理，而且直接写入数组的话，JavaScript会自动调用数组的toString()方法，把元素用逗号连在一起，难怪内容全混排了😅。

下面给你几个实用的解决办法，完美模拟控制台的换行效果：

方法1：用<pre>标签包裹内容 #

<pre>标签的特性就是保留文本中的空格、换行和缩进，和控制台的输出风格完全一致，最简单直接：

// 假设你的数组是这样的
const arr2 = ["用户注册成功", "订单编号：20240520001", "支付状态：已完成"];
const myWindow = window.open("", "MsgWindow", "width=800,height=800");
// 用join("\n")把数组转成带换行的字符串，再用<pre>包裹
myWindow.document.write(`<pre>${arr2.join("\n")}</pre>`);

方法2：用<br>替换换行符 #

如果不想用<pre>自带的等宽字体，想让内容更贴合页面样式，可以把数组元素用<br>连接——这是HTML里标准的换行标签：

const arr2 = ["用户注册成功", "订单编号：20240520001", "支付状态：已完成"];
const myWindow = window.open("", "MsgWindow", "width=800,height=800");
myWindow.document.write(arr2.join("<br>"));

方法3：自定义CSS实现换行 #

要是需要更灵活的样式控制（比如自定义字体、行高），可以给内容容器加上white-space: pre-wrap的CSS属性，既能保留换行，又能让文本自动换行适应窗口宽度：

const arr2 = ["用户注册成功", "订单编号：20240520001", "支付状态：已完成"];
const myWindow = window.open("", "MsgWindow", "width=800,height=800");
myWindow.document.write(`
  <div style="white-space: pre-wrap; font-size: 16px; line-height: 1.5;">
    ${arr2.join("\n")}
  </div>
`);

小提醒 #

千万别直接写myWindow.document.write(arr2)，因为数组会被自动转成用逗号分隔的字符串（比如"a,b,c"），这就是你看到内容混排的原因——一定要用join()方法指定分隔符哦！

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