I'm a new learner of JavaScript. I was learning how to change the header as a part of the DOM. Now, what I don't understand is why when you place the src code in HTML right at the top it doesn't work (title doesn't get changed). However, when I put the same src code right at the end the title does get changed.
Please be specific as you can as I'm still new to this. Much appreciated.
<html>
<head>
<title>Simple Page</title>
</head>
<body>
<h1 id="main">Interesting Headline</h1>
<p>Simple Web Page</p>
<script src="script.js"></script> <!-- does work -->
</body>
</html>
<html>
<head>
<script src="script.js"></script> <!-- does not work!, why? -->
<title>Simple Page</title>
</head>
<body>
<h1 id="main">Interesting Headline</h1>
<p>Simple Web Page</p>
</body>
</html>
JavaScript code;
var headline = document.getElementById("mainHeading");
headline.innerHTML = "Wow! A new headline!";
