What are some examples of stopping propagation in JavaScript?

Can you explain what stopping propagation means in JavaScript?

Stopping propagation in JavaScript refers to preventing an event from bubbling up or capturing down the DOM tree.

Can you give me an example of how to stop propagation?

Sure! You can use the event.stopPropagation() method in an event handler to stop the event from reaching parent elements.

When would I need to use this?

You might use it when you have nested elements and want to prevent a parent element's event handler from executing.

Can you show me a code snippet?

Absolutely! Here's a simple example:

document.getElementById('child').addEventListener('click', function(event) {
    event.stopPropagation();
    console.log('Child clicked!');
});

document.getElementById('parent').addEventListener('click', function() {
    console.log('Parent clicked!');
});

In this case, clicking the child won't trigger the parent's click event.