Element removeEventListener Lab
In this lab, you will demonstrate your understanding of removeEventListener
by creating a simple web page with buttons and event listeners. The removeEventListener
method allows you to remove previously attached event listeners from an HTML element.
You will create a button with id add
and another button with id remove
. You will also create a div called status
that displays the status of event listeners. When the user clicks on the add
button, a click event listener will be added to the remove
button to display an alert saying 'Button clicked!'. When the user clicks on the remove
button, the click event listener added previously should be removed.
To successfully complete this lab, you must complete the following challenges:
- Create the
add
button with the correct id. - Create the
remove
button with the correct id. - Create the
status
div that updates the status of event listeners. - Add a click event listener to the
add
button. - Add a click event listener to the
remove
button. - Remove the click event listener from the
remove
button.
You must also write an evaluation script that ensures all challenges are met and can be tested within the lab environment.