pointerdown vs onclick: what is the difference?

What is the difference between the onpointerdown and onclick event handlers?

Are there any practical differences? Are the events not propagated the same up the DOM tree? Are there some devices that only respond to one of these events?

I initially assumed that it is only pointerdown that is triggered in touch devices or with a pen, but onclick seems to be triggered as well.

Answer

1. Are there any practical differences?

Yes there are.

pointerDown it’s actually equivalent to onMouseDown but the main difference is that mouseDown only sends to an Element but pointerDown can be sent to Document, Window, and Element.

2. What is the difference between the onpointerdown and onclick event handlers?

• pointerDown can captures the right/left/middle clicks.

• onClick only captures the left click.

Live Example:

The example will make it clearer.

https://codepen.io/nawafscript/pen/WNEyRyO