View on GitHub

WiTNY Summer Guild 2018

The tech industry, in one week

BACK TO THURSDAY

Exercise 3 - HTML & JavaScript interaction

Remember, you always have to do something to make a program start running?

With JavaScript code, if it is included in the script – code – part of an HTML web page, that code runs… as soon as the page is loaded.

So far, most of the JavaScript code you’ve seen just shows you things with the special alert() function provided in the JavaScript programming language, that you can run to see those nice text boxes that appear with info in them.

But you can also write JavaScript code that changes what shows up on the web page – the data inside the HTML tags, so it looks almost as if the result of the JavaScript program is automatically there.

It’s not really – the JavaScript program runs right when the web page loads. But that’s so fast, a human can barely notice it (without using special tools to slow it down, anyway).

Check out this web page with a JavaScript program inside <script> tags:

<!DOCTYPE html>
<html>
  <body>

    <h1>My First Web Page</h1>

    <h3>Beginning information</h3>
    <p>My First Paragraph</p>

    <p id="demo"></p>

    <p id="new-para"></p>

    <script>
      document.getElementById("demo").innerHTML = 5 + 6;
    </script>

  </body>
</html>

Questions to answer & stuff to try