JavaScript Events Worksheet

Questions

Question 1

What is an 'event handler'?

An event handler is a function that runs when a specific event happens on a webpage—such as a click, key press, mouse movement, or page load.

Question 2

How are event handlers invoked?

Event handlers are invoked automatically by the browser when the event they’re listening for occurs. For example, if a click event happens on a button, the click handler is automatically executed.

Question 3

What is an 'anonymous' function?

An anonymous function is a function that does not have a name. It is often used directly inside event listeners, like:
element.addEventListener("click", function(){ ... });

Question 4

Explain what the addEventListener() method of a DOM element is, and explain the purpose of each of it's parameters.

addEventListener() attaches an event handler to an element. It has two main parameters:

1. The event name — a string like "click", "mouseover", "keydown".
2. The event handler function — the function the browser should run when the event occurs.

Example: button.addEventListener("click", doSomething);

Coding Problems

Coding Problems - See the 'script' tag below this h3 tag. You will have to write some JavaScript code in it.

Always test your work! Check the console log to make sure there are no errors.

Orange

Green