add-dom-event-listener

What is add-dom-event-listener?

The add-dom-event-listener npm package is a utility for adding and removing DOM event listeners in a simple and efficient manner. It abstracts the complexity of managing event listeners, providing a straightforward API for attaching and detaching events.

What are add-dom-event-listener's main functionalities?

Add Event Listener

This feature allows you to add an event listener to a DOM element. In this example, a click event listener is added to an element with the ID 'myElement'. When the element is clicked, 'Element clicked!' is logged to the console.

const addEventListener = require('add-dom-event-listener');

const handleClick = () => {
  console.log('Element clicked!');
};

const element = document.getElementById('myElement');
const listener = addEventListener(element, 'click', handleClick);

Remove Event Listener

This feature allows you to remove an event listener that was previously added. In this example, the click event listener added in the previous feature is removed.

listener.remove();

Other packages similar to add-dom-event-listener

eventemitter3

EventEmitter3 is a high-performance event emitter for Node.js and the browser. It provides a similar functionality of managing events but is more focused on custom event handling rather than DOM-specific events.

mitt

Mitt is a tiny functional event emitter. It is similar to add-dom-event-listener in that it provides a simple API for event handling, but it is more lightweight and designed for custom events rather than direct DOM event management.

on

The 'on' package is a utility for adding and removing event listeners in a cross-browser compatible way. It is similar to add-dom-event-listener but offers more comprehensive support for different types of events and browsers.

README

add-dom-event-listener

add dom event listener. normalize ie and others. port from https://github.com/modulex/event-dom

examples

var addEventListener = require('add-dom-event-listener');
var handler = addEventListener(document.body, 'click', function(e){
  console.log(e.target); // works for ie
  
  console.log(e.nativeEvent); // native dom event
});