Exercise 10.5

This is Exercise 10.5, lecture on traversing DOM with Javascript, used in the course IDATA2301 Web technologies at NTNU, campus Aalesund.

Go back to exercise list.

Purpose

The purpose of the exercise is to learn how you can modify text inside HTML elements when an event happens.

Instructions

  1. Create a new HTML document which has one paragraph (<p>) element in it. The text inside it should be "Loading...".
  2. Add a Javascript to the page, which sets the text in the <p> element to "Hello" when the document is loaded. (Hint: <body onload="...">).
  3. Add a paragraph to the same HTML document that shows a text: "X seconds have passed since the page was loaded”. Update X every second.
  4. Create a "calculator":
    1. Two text inputs (let us call them A and B), the user can input a number in each of them. Set A=3, B=5 by default.
    2. A text saying: "the two numbers multiplied are Y".
    3. Update the Y to be A*B whenever text changes in any of the inputs.
    4. Extra challenge: show "Not a number!" when either A or B (or both) are not numbers.

Solution

You can find a solution here.