In html5 to set a checkbox as checked, should i si

问题:

Currently in our plugin we were setting the checkboxes as checked by setting

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

This was to preserve xhtml compatibility. I'm more used to setting checked as a property

<input type="checkbox" checked />

What is the correct way to proceed in html5?Should we still care about xhtml compatibility?

回答1:

It is an attribute in either case. And it sets a value (the same value, true) on a DOM property of the element node in either case.

For most purposes, it does not matter which syntax you use. However, there are some points to note:

• If you use HTML5 in XML serialization (“XHTML5”), you must use checked="checked".
• In styling, the syntaxes are not quite equivalent when using attribute selectors (the shorter form does not match [checked=checked]), but this does not matter in practice: [checked] matches checked checkboxes in either case.
• The clumsy syntax checked="checked" is a holdover from SGML and included for compatibility only, so it may make your code look old-fashioned (which rarely matters).

回答2:

<!-- Default to unchecked -->
<input type="checkbox">

<!-- Default to checked, XHTML -->
<input type="checkbox" checked="checked" />

<!-- Default to checked, HTML5 -->
<input type="checkbox" checked>

Source: http://css-tricks.com/indeterminate-checkboxes/

回答3:

Checked is a boolean attribute in HTML 5. A true value is indicated by the attribute being present, and a false value is indicated by its absence. If it is present, its value should either be empty or set to the property name checked="checked". Either of these forms are correct:

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

https://www.w3.org/TR/html5/infrastructure.html#sec-boolean-attributes

回答4:

You care about XHTML-compatibility in HTML5, if you are creating documents that use the XHTML serialization of HTML5, either exclusively by serving the document with an application/xhtml+xml mime type, or creating a polyglot document that can be served either as application/xhtml+xml or as text/html (the 'normal' html mime-type).

If you are only using text/html, then you do not need to care about XHTML syntax. However, you may use XML-style self-closing syntax when embedding SVG or MathML in your page. (SVG is widely supported in the latest browsers, MathML less so.) You may also use /> to end void HTML elements such as meta, link, input, img etc, but this has no effect different from using > to end those elements.

A minor comment on terminology. In markup, in common parlance either checked or checked="checked" is an "attribute". A "property" is something else.

回答5:

According to http://www.w3.org/TR/html-markup/input.checkbox.html it's an attribute