In the body, it can't present the variable value, but only shows variable name "var1". Besides, I use "\n" in document.write, but how come it doesn't break the line in the result?
<script type="text/javascript">
var var1=123;
document.write("<strong>Hello World! \nThis is the second line.</strong>");
</script>
</head>
<body>
<h1>the value for number is: + var1</h1>
</body>
Here is a basic example.
const name = 'john doe';
const header = document.createElement('h1');
const text = document.createTextNode(`my name is ${name}`);
header.appendChild(text);
document.body.appendChild(header);
Use the line-break tag, br, instead of \n.
As for the displaying the variable:
The variable var1 can only be used inside the javascript code block. The line
<h1>the value for number is: + var1</h1>
will not be executed as actual javascript code since it is not inside the javascript block. You can do it like this:
<head />
<script>
function main() {
var var1=123;
document.getElementById("text").innerHTML += var1
}
document.write("<strong>Hello World! <br />This is the second line.</strong>");
</script>
</head>
<body onLoad="main()">
<h1 id="text">the value for number is: </h1>
</body>
As for the variable part of the question, there are at least 2 ways of achieving what you want:
Method 1
Use DOM Manipulation to change the inner text of the h1 tag like so:
var var1=123;
document.getElementsByTagName('h1')[0].innerText = "the value for number is: " + var1
Method 2
You can write html in EJS(Embedded Javascript) format, where in essence you can pass variables directly to the html tags:
<% var var1=123; %>
<h1>the value for number is: <%= var1 %></h1>
If you are interested in learning about EJS then look here. It's worth mentioning that EJS is an external library (thanks cale_b for pointing this out in the comments)
As for the break part of the question, you need to replace "n\":
document.write("<strong>Hello World! <br/>This is the second line.</strong>");
