In this section, we will learn what the document removeEventListener() method is and how to use it in JavaScript.

What is document removeEventListener() Method in JavaScript?

The JavaScript document removeEventListener() method is used to remove an event listener for a specific event that is currently set on a document using `document.addEventListener()` method. After invoking the removeEventListener() method, the handler no-longer gets execute when that specific event occurs on the document.

document removeEventListener() Method Syntax:

document.removeEventListener(event, function, useCapture)

document removeEventListener() Method Parameters

The method takes three arguments:

• The first argument is the name of the event that we want to remove the handler that is already set for it.
• The second argument is a reference to the function that was set as the handler of the event. (The method that we put as the second argument of the addEventListener() method).
• The third argument, which is optional, is a boolean value indicating the phase to remove the handler from.

The value true means remove the handler from the capturing phase. And The value false (which is the default) means remove the handler at the bubbling phase.

Note: if the function handler that we set as the second argument of the addEventListener was anonymous or an arrow function, the removeEventListener() method won’t work on that handler anymore! This is because there’s no way for the removeEventListener() method to get a reference to that function.

document removeEventListener() Method Return Value

The method does not return a value.

Example: using document removeEventListener() Method in JavaScript

See the Pen using document removeEventListener() Method in JavaScript by Omid Dehghan (@odchan1) on CodePen.