JavaScript setting pointer-events

Question

I am trying to set pointer-events: none for a div through JavaScript, however the property is not being applied.

I have tried:

document.getE         


        

Answer 1

There is an example in a book which uses element.setAttributeNS(null, "pointer-events", "none"); instead of using element.style.pointer-events = "none";.

Answer 2

You can access style properties via Bracket notation like this:

document.getElementById("div").style['pointer-events'] = 'auto';

No need in camel case modification in this case.

Answer 3

Your first attempt failed because it was a CSS property and not an attribute (part of the style attribute).

Your second attempt failed because for some off reason, when making this API casing-like-this gets converted to camelCasingLikeThis . This is likely because the folks who built JavaScript and the folks who built CSS weren't very well coordinated.

The following should work:

document.getElementById("div").style.pointerEvents = "none";