在 JavaScript 中使用转义序列添加新行
在 JavaScript 中使用 Temperate Literals 添加新行
在 JavaScript 中使用 HTML Break 元素添加新行
本文将介绍一些 JavaScript 换行方法以及在处理字符串时如何使用它们。
JavaScript 中的字符串操作可能是一个棘手的话题。字符串操作易于学习但难以实现，其中之一就是在字符串中添加新行。
JavaScript 中有很多换行的方法，但它们并不像 HTML 中的段落或换行标签那么简单。
让我们看一下 JavaScript 中最常用的换行方法。
在 JavaScript 中使用转义序列添加新行
转义序列是在 JavaScript 中创建新行的流行方式。 \n 转义序列在 Windows 和 Linux 上创建换行符，但 \r 用于一些较旧的 Mac。
转义序列的实现非常简单。
let orgnstring = 'Hello Shiv welcome to upwork platform';
let newstring = 'Hello Shiv \nwelcome to\nupwork platform';
console.log(orgnstring);
console.log(newstring);
运行代码
注意
不要在换行符转义序列后包含空格，因为 JavaScript 将其视为空格并将其附加到输出中。
输出
Hello Shiv welcome to upwork platform
Hello Shiv
welcome to
upwork platform
在 JavaScript 中使用 Temperate Literals 添加新行
模板文字听起来很酷，但它们只是接受内联表达式的字符串文字。
使用多行字符串更容易。模板文字用反引号括起来。
let orgnstring = 'Hello Shiv welcome to upwork platform';
let newstring = `Hello Shiv
welcome to
upwork platform`;
console.log(orgnstring);
console.log(newstring);
运行代码
输出
Hello Shiv welcome to upwork platform
Hello Shiv
welcome to
upwork platform
在这两种情况下，返回的输出都是相同的。但正如你所见，模板文字使编写多行字符串变得更加容易。
在 JavaScript 中使用 HTML Break 元素添加新行
将 HTML 换行元素添加到一行是另一种添加新 JavaScript 行的方法。
只有在换行很重要时才应使用换行元素。但是，请考虑这种方法，因为它很常见。
运行代码
输出
Hello shiv
welcome to
upwork platform
注意
与任何文本内容一样，不要忘记使用 .innerHTML 而不是 .innerText。
Enjoying our tutorials? Subscribe to DelftStack on YouTube to support us in creating more high-quality video guides. Subscribe