Difference between event.stopPropagation and event.stopImmediatePropagation()

event.stopPropagation will prevent handlers on parent elements from running.
Calling event.stopImmediatePropagation will also prevent other handlers on the same element from running.

pls refer the below link.

Say, if you have a <table>, with <tr>, and then <td>. Now, let’s say you set 3 event handlers for the <td> element, then if you do event.stopPropagation() in the first event handler you set for <td>then all event handlers for <td> will still run, but the event just won’t propagate to <tr> or <table> (and won’t go up and up to <body><html>document, and window).

Now, however, if you use event.stopImmediatePropagation() in your first event handler, then, the other two event handlers for <td> WILL NOT run, and won’t propagate up to <tr><table>(and won’t go up and up to <body><html>document, and window).