How to Break Line in JavaScript

While uploading or writing blogs on websites, developers need to break the lines of the text for better readability. Moreover, sometimes, programmers create text-based output on the console for testing their code. They need to break up their statements into multiple lines. That’s why the line break in JavaScript is important to learn for JavaScript coding.

This blog will define the ways to break a line during code in JavaScript.

How to Break Line in JavaScript?

To break a line in JavaScript code, use the following mentioned methods:

- Using \n (the newline escape character)
- Using template literals
- Using tag

Method 1: Break Line in JavaScript Using “\n” Character

Use the “\n” character to break the line in JavaScript. It is an escape character that breaks the lines for a new line. It is the most helpful and commonly used approach. You can easily utilize it in a “console.log()” method or any string.

Example

Create a variable “string” that contains different strings which will print on separate lines with the help of “\n” (the newline escape character):

var string = "Welcome to the Linuxhint \nHere you will learn different Programming skills \nSuch as 'Java', 'JavaScript', 'HTML/CSS' and so on";

Finally, print the variable “string” on the console using “console.log()” method:

console.log(string);

It can be observed that the three strings have been displayed on the console in three different lines:

Method 2: Break Line in JavaScript Using Template Literals

You can also print strings on different lines by pressing the enter key in the string or the “console.log()” method. For that purpose, use the “template literals” (`).

Example

Create a string that stores different strings with line breaks by pressing the enter key using template literals:

var string = `Welcome to the Linuxhint
Here you will learn different Programming skills
Such as 'Java', 'JavaScript', 'HTML/CSS' and so on`;

It will print the string in the same pattern on the console using the “console.log()” method:

console.log(string);

Output

Method 3: Break Line in JavaScript Using “ ” Tag

You can also use the HTML “ ” tag in JavaScript to break the line in the “document.write()” method or in the “console.log()” method or any string.

Example

For printing something on the web page, we usually use the “document.write()” method by passing the text. Here, we will print different strings on the web page by breaking the lines using the “ ” tag in the “document.write()” method:

document.write("Welcome to the Linuxhint");
document.write(" ");
document.write("Here you will learn different Programming skills");
document.write(" ");
document.write("Such as 'Java', 'JavaScript', 'HTML/CSS' and so on");

It can be seen that all the text has been displayed on the web page on separate lines:

You can also print text on the particular position on the web page. Here, we will specify an area using the “” tag by assigning an id that is utilized to access this tag in JavaScript code:

Create a string that stores a text that will display on that specified area. Here, we will concatenate the tag with the strings to break the lines:

let breakLinesCode = "Welcome to the Linuxhint" + " " + "Here you will learn different Programming skills" + " " + "Such as 'Java', 'JavaScript', 'HTML/CSS' and so on";

Get the reference of the tag using its assigned id with the help of “getElementById()” method and display text using the “innerHTML” property:

document.getElementById("breakLines").innerHTML = breakLinesCode;

Output

We have gathered all the relevant information to break the line in JavaScript.

Conclusion

To break a line in JavaScript, use the “\n” (the newline escape character), “template literals”, or an HTML “ ” tag with the “document.write()” method or the “innerHTML” property. This blog defined the ways to break a line during code in JavaScript.

How to Break Line in JavaScript