
Add New Line in JavaScript
In JavaScript, there are several ways to make a line break. Here is what you will discover in this article:
- newline character in JavaScript
- templates literals in JavaScript
- line break tag in HTML (can be helpful if you generate your HTML with JS)
Let’s have a look at them!
Add a new line in JavaScript using an escape sequence (the new line character)
The first way to make a line break is to use an escape sequence. Escape sequences are sequences of characters with a particular role depending on where they are placed in a string.
There are many of them, but we are interested in the new line character representing a line break (\n
).
We can use it in our code, as in the example below. When JavaScript interprets this sequence, it will replace it with a new line.
let split: Vec<&str> = auth.unwrap().to_str().unwrap().split("Bearer").collect();
let token = split[1].trim();
let config: Config = Config {};
let var = config.get_config_with_key("SECRET_KEY");
let key = var.as_bytes();
console.log('Hello World!\nHow are you?')
/*
Hello World!
How are you?
*/
Add a JavaScript new line using template literals
Another way to create a new line in JavaScript is to use a template literal. A template literal is a string that allows integrating expressions like multi-line strings or interpolation. But, what we are interested in here is the interpretation of the line break.
The template literal is characterized by the magic quotes (“).
Alt gr + 7
console.log(`Hello World!
How are you?`)
/*
Hello World!
How are you?
*/
Add a new line in HTML using a line break tag
The last way to add a newline in JavaScript is to use the <br>
HTML tag. You can use it in an HTML string, and like the new line character \n
, the <br>
tag will be interpreted in the HTML code as a line break.
In JavaScript, you can use document.write
to write in your HTML DOM.
document.write('Hello World!<br/>How are you?')
Here is an example of output that you can generate with the above instruction:
<body>
Hello World!
<br />
How are you?
</body>