what is the difference between below two ways of disabling the element in java script

Question

I have to disable some elements in my Javas Script code , which one is better for disabling an element through Java Script :

 1.   document.getElementById("eleId").disabled = true;

 2.   document.getElementById("eleId").disabled = "disabled";

Please anyone describe these functions and what is the difference between these ?

Answer 1

Both cases are valid.

In case 1, you are setting the attribute 'disabled' to the boolean value 'true'. In case 2, you are setting the attribute 'disabled' to the string value 'disabled'.

If you were going to set this value via HTML, normally you could get away with just having the bare attribute 'disabled' on the tag listed. But for XHTML/XML style compliance, you would use the well formed attribute disabled="disabled".

Basically, if the browser detects that the attribute 'disabled' is present, (I think) it will disable the element.

EDIT Another SO user (RobG) pointed out that this sets the 'DOM property' of the element in question not the 'attribute'.

When dealing with the result from 'getElementById', you are dealing with a representation of the structure of the document. When you make modifications you are settings properties on an 'object model'. Having programmed in Java for so long, I typically interchange the term property & attribute. In the case of saying "it sets the attribute", I was incorrect. Saying that I were to set the 'attribute' would mean that I would have modified the document (HTML) to change the value of "disabled" in the actual source. What this is actually doing is modifying the object tree setting the property of the representative object.

Answer 2

In XHTML, attribute minimization is forbidden, and the disabled attribute must be defined as disabled="disabled"

In normal HTML, we can have like disabled=true