JavaScript 中的换行符
本文将介绍一些 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);
运行代码
输出
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 行的方法。
只有在换行很重要时才应使用换行元素。但是，请考虑这种方法，因为它很常见。
<html>
<body>
<p id="newline"></p>
<script>
let orgnstring = "Hello shiv" + "<br>" + "welcome to "+ "<br>" + "upwork platform";
document.getElementById("newline").innerHTML = orgnstring;
</script>
</body>
</html>
运行代码
输出
Hello shiv
welcome to
upwork platform
相关文章
Do you understand JavaScript closures?
发布时间：2025/02/21 浏览次数：108 分类：JavaScript
-
The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.
Do you know about the hidden traps in variables in JavaScript?
发布时间：2025/02/21 浏览次数：178 分类：JavaScript
-
Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av
How much do you know about the Prototype Chain?
发布时间：2025/02/21 浏览次数：150 分类：JavaScript
-
The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start
用 jQuery 检查复选框是否被选中
发布时间：2024/03/24 浏览次数：102 分类：JavaScript
-
在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的
jQuery 中的 Window.onload 与 $(document).ready
发布时间：2024/03/24 浏览次数：180 分类：JavaScript
-
本教程演示了如何在 jQuery 中使用 Window.onload 和 $(document).ready 事件。
