uconnect
v0.3.0
Published
An essential connected/disconnected DOM helper
Downloads
406
Maintainers
Readme
µconnect
Social Media Photo by JOHN TOWNER on Unsplash
A modern take at disconnected module, dropping IE < 11 support and providing a much better API.
import {observe} from 'uconnect';
const observer = observe(
root = document, // the default root node to observe
parse = 'children', // the kind of nodes to parse: children or childNodes
CE = CustomEvent, // the default Event/CustomEvent constructor to use
MO = MutationObserver // the default MutationObserver constructor to use
);
const node = document.createElement('button');
observer.connect(node, {
connected(event) {
// node is connected
console.log(`node is ${event.type}`);
},
disconnected(event) {
// node is disconnected
console.log(`node is ${event.type}`);
}
});
// will trigger connected(event)
document.body.appendChild(node);
setTimeout(() => {
// will trigger disconnect(event)
node.remove();
setTimeout(() => {
// will stop observing this specific node
// after removing connecetd/disconnected listeners
observer.disconnect(node);
// will stop observing all nodes
// and disconnect the MutationObserver
observer.kill();
});
});