When I write an input tag with checked property like

<input type="radio" checked="checked" />

this is not working. i was looking at this post and it says checked="true" should be used instead. It really works like that. But why? Any clarification would be appreciated. Thanks

CodePudding user response：

See the specification:

A number of attributes are boolean attributes. The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value.

If the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace.

The values "true" and "false" are not allowed on boolean attributes. To represent a false value, the attribute has to be omitted altogether.

Here is an example of a checkbox that is checked and disabled. The checked and disabled attributes are the boolean attributes.

<label><input type=checkbox checked name=cheese disabled> Cheese</label>

This could be equivalently written as this:

<label><input type=checkbox checked=checked name=cheese disabled=disabled> Cheese</label>

You can also mix styles; the following is still equivalent:

<label><input type='checkbox' checked name=cheese disabled=""> Cheese</label>

The code you say doesn't work, works:

<input type="radio" checked="checked" />
<input type="radio" />

checked="true" works due to error recovery in browsers, but it is wrong and you should not depend on that behaviour.