Hello Word javascript

Question

Hello Word javascript

Navigation

#1 by (3 votes)
#2 by (0 votes)

2

I'm following the firefox tutorial but I'm not able to run a hello word. Follow the code.

HTML code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Javascript 01</title>
    <script type="text/javascript" src="scripts/main.js"></script>
</head>
<body>
    <h1>Teste</h1>
</body>
</html>

JavaScript code

alert('123');
var myHeading = document.querySelector('h1');
myHeading.textContent = 'Hello world!';

alert works, it's getting there. I wanted to know why you did not change the text from h1 to Hello Word.

javascript html

asked by anonymous 25.11.2016 / 13:22

2 answers

0

Another option is to put the code in onload :

window.onload = function(){
    var myHeading = document.querySelector('h1');
    myHeading.textContent = 'Hello world!';
}

25.11.2016 / 13:26

How to return today's type input date? Pass data from one form to another class [closed]

score 3 · Accepted Answer

Because your Javascript is in head , that is, it is running before h1 is in DOM .

Option 1 - Load at the end of the body:

Change to the following:

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Javascript 01</title>
  </head>
  <body>
    <h1>Teste</h1>
    <script type="text/javascript" src="scripts/main.js"></script>
  </body>
</html>

Option 2 - Using the onload event:

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Javascript 01</title>
    <script type="text/javascript" src="scripts/main.js"></script>
  </head>
  <body onload="executar()">
    <h1>Teste</h1>
  </body>
</html>

JS

function executar() {
  alert('123');
  var myHeading = document.querySelector('h1');
  myHeading.textContent = 'Hello world!';
}