[Solved] CSIT128 Lab 4

Question 1. Create 2 buttons on a web page: Console Hi and Alert Hi.

When the user clicks on the button Console Hi, display a message to the console: Hi there! JavaScript is cool!

When the user clicks on the button Alert Hi, an alert window will appear and it displays the same message: Hi there! JavaScript is cool!

(If you are using Chrome, to view the Console, right click on the web page and select Inspect, then click on the Console tab. If you are using Firefox, to view the Console, right click on the web page and select Inspect Element, then click on the Console tab.)

Question 2. Create 2 buttons on a web page: Lion and Frog. Below the buttons, display a text field.

When the user clicks on the button Lion, the text field displays The Lion Button is clicked. When the user clicks on the button Frog, the text field displays The Frog Button is clicked.

Question 3. Create 2 buttons on a web page: Lion and Frog.

When the user clicks on the button Lion, a picture of a lion is shown.

When the user clicks on the button Frog, a picture of a frog is shown.

Question 4. On a web page, display an image of a lion and an image of a frog.

When the user clicks on the lion image, a message Roar in orange color appears on the page.

When the user clicks on the frog image, a message Ribbit in green color appears on the page.

Question 5. On a web page, display an image of a lion and an image of a frog. Under the images, display the following two messages.

Number of lion clicks: 0

Number of frog clicks: 0

The two messages are in orange color and green color, respectively.

When the user clicks on the lion image, the lion click count is increased.

When the user clicks on the frog image, the frog click count is increased.

Question 6. On a web page, display an image of a frog.

Each time the user clicks on the frog image, show one more frog face on the page.

Below is what displayed after the user clicked on the frog image 10 times. We can see that the page shows 10 frog faces. We can use the following character entity hex code for the frog face x1F438.