Passing Parameters

When passing parameter values, use an “anonymous function” to invoke the specified function with the parameters.

Example

element.addEventListener(“click”, function(){ myFunction(p1, p2); });

Event Bubbling or Event Capturing?

In the HTML DOM, event propagation occurs via bubbling or capturing. Bubbling handles the innermost element’s event first, then outer elements, while capturing handles the outermost element’s event first, then inner elements.

With the addEventListener() method, you can specify the event propagation type using the optional useCapture parameter.

addEventListener(event, function, useCapture);

The default value is false, which means event propagation uses bubbling. When set to true, the event will use capturing propagation instead.

Example

document.getElementById(“myP”).addEventListener(“click”, myFunction, true);
document.getElementById(“myDiv”).addEventListener(“click”, myFunction, true);

The removeEventListener() method

The removeEventListener() method is used to remove event handlers that were previously attached using the addEventListener() method.

Example

element.removeEventListener(“mousemove”, myFunction);