What is the proper way to check and uncheck a checkbox in HTML5?

According to HTML5 drafts, the checked attribute is a “boolean attribute”, and “The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value.” It is the name of the attribute that matters, and suffices. Thus, to make a checkbox initially checked, you use

<input type=checkbox checked>

By default, in the absence of the checked attribute, a checkbox is initially unchecked:

<input type=checkbox>

Keeping things this way keeps them simple, but if you need to conform to XML syntax (i.e. to use HTML5 in XHTML linearization), you cannot use an attribute name alone. Then the allowed (as per HTML5 drafts) values are the empty string and the string checked, case insensitively. Example:

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

For checked state

Older browsers may need:

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

But nowadays simply do:

<input type="checkbox" checked />

For unchecked state

Remove checked attribute, like:

<input type="checkbox" />

Reference: http://www.w3.org/TR/html-markup/input.checkbox.html#input.checkbox.attrs.checked


<input type="checkbox" checked />

HTML5 does not require attributes to have values