Remove Event Listener
Description :
The Remove Event Listener is used in Javascript to remove event handlers from DOM elements. Any event can have multiple event listeners so the remove event listener takes 2 arguments - the event type and the function you want to remove from the list of functions that were added to the event by addEventListener.
Syntax for removeEventListener:
let domElement = document.getElementById("some_id");
domElement.removeEventListener("event_name", function_to_NOT_call_anymore);
Exercise :
This is the code used for the button :
<button id="button-1"> Change Picture </button>
Originally the "Change Picture" button on clicking changes the picture.
However we can remove the event listener quite easily.
Here's another button:
<button id="button-2"> Click to remove the Event Listener from Button-1 </button>
Click on the second button to now remove the event listener from the "Change Picture" button.
When the second button is clicked, we simply remove the changePicture function from the list of functions to call
in the even of a click on "button-1".
let button = document.getElementById("button-1");
button.removeEventListener("click", changePicture);