JavaScript 中如何实现换行

在 JavaScript 编程中，实现换行是一项常见需求，不同的场景下有不同的实现方式。

在字符串中实现换行较为常用。如果是在普通字符串中，可使用转义字符 \n。例如：

let str = "第一行\n第二行";
console.log(str);

在控制台输出时，\n 会起到换行作用，将字符串分成两行显示。不过要注意，在 HTML 页面中直接使用 \n 并不会换行，因为 HTML 会忽略字符串中的换行符。

在 HTML 页面中展示换行文本，可借助 DOM 操作。比如创建一个 <p> 标签，然后将需要换行的文本分别添加到不同的 <br> 标签之后，再将这些内容添加到 <p> 标签中，最后将 <p> 标签添加到页面。示例代码如下：

let p = document.createElement('p');
let text1 = document.createTextNode('第一行');
let br = document.createElement('br');
let text2 = document.createTextNode('第二行');
p.appendChild(text1);
p.appendChild(br);
p.appendChild(text2);
document.body.appendChild(p);

在多行文本输入框（<textarea>）中实现换行相对简单。用户输入的内容会按照实际换行情况显示。若要通过 JavaScript 动态设置 <textarea> 的值并实现换行，直接在设置的值中使用 \n 即可。例如：

let textarea = document.getElementById('myTextarea');
textarea.value = "第一行\n第二行";

在模板字符串中换行更加直观。模板字符串使用反引号（）包裹，在其中可以直接按下回车键进行换行，无需使用 \n`。示例如下：

let templateStr = `第一行
第二行`;
console.log(templateStr);

掌握在 JavaScript 中不同场景下的换行实现方法，能帮助开发者更灵活地处理文本显示与交互，无论是在控制台输出调试信息，还是在网页上呈现复杂的文本布局，都能游刃有余。