HOWTO · JavaScript
JavaScript 中的換行符
如何在 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);
注意
不要在換行符轉義序列後包含空格，因為 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 行的方法。
只有在換行很重要時才應使用換行元素。但是，請考慮這種方法，因為它很常見。
<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
注意
與任何文字內容一樣，不要忘記使用
.innerHTML 而不是 .innerText。