[SOLVED] How do I verify whether a readonly attribute was defined for an input element using Javascript

Question

Assuming an input element as follows

<input type="number" id="num" readonly value="1000" />

How do I verify whether 'readonly' was defined (or not) for that element?

In JS code section I tried
console.log(<element-id>.readonly); // empty

Also I tried
console.log(<element-id>.getAttribute("readonly");

But I'm not sure whether any of these actually tell me whether or not 'readonly' attribute was defined, because they give different result.

I just need to be confirmed whether 'readonly' attribute was defined in case I want to remove, toggle or define the attribute (depending on previous status). And I feel that removing, toggling or defining an attribute makes no sense when its previous presence is unknown in the first place anyways.

Thanks in advance 🙏

Answer 1

Close, it's `myinput.readOnly` :)

It's a boolean and you can just set a new value to update the input on the page.

Answer 2

Schindlabua
Thanks a bunch 🙏

The getAttribute() still not giving me a good hint even passing 'readOnly' as argument.

I guess I'll take the <element>.readOnly approach 😂