Qual é o valor adequado para um atributo marcado de uma caixa de seleção HTML?

Todos nós sabemos como formar uma entrada de caixa de seleção em HTML:

<input name="checkbox_name" id="checkbox_id" type="checkbox">

O que eu não sei - qual é o valor tecnicamente correto para uma caixa de seleção marcada? Eu já vi todos esses trabalhos:

<input name="checkbox_name" id="checkbox_id" type="checkbox" checked>
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="on">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="yes">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="checked">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="true">

A resposta é que isso não importa? Não vejo nenhuma evidência para a resposta marcada como correta aqui na própria especificação :

Caixas de seleção (e botões de opção) são botões liga / desliga que podem ser alternados pelo usuário. Uma opção está "ligada" quando o atributo verificado do elemento de controle está definido. Quando um formulário é enviado, apenas os controles da caixa de seleção "ativado" podem ter êxito. Várias caixas de seleção em um formulário podem compartilhar o mesmo nome de controle. Assim, por exemplo, as caixas de seleção permitem que os usuários selecionem vários valores para a mesma propriedade. O elemento INPUT é usado para criar um controle de caixa de seleção.

O que um escritor de especificações diria que é a resposta correta? Forneça respostas baseadas em evidências.

Estritamente falando, você deve colocar algo que faça sentido - de acordo com as especificações aqui , a versão mais correta é:

<input name=name id=id type=checkbox checked=checked>

Para HTML, você também pode usar a sintaxe de atributo vazio , checked=""ou mesmo simplesmente checked(para XHTML estrito, isto é não é suportado ).

Efetivamente, no entanto, a maioria dos navegadores suporta praticamente qualquer valor entre as aspas. Todos os seguintes itens serão verificados:

<input name=name id=id type=checkbox checked>
<input name=name id=id type=checkbox checked="">
<input name=name id=id type=checkbox checked="yes">
<input name=name id=id type=checkbox checked="blue">
<input name=name id=id type=checkbox checked="false">

E apenas o seguinte será desmarcado:

<input name=name id=id type=checkbox>

Veja também esta pergunta semelhante em disabled="disabled".

Especificação HTML5 :

http://www.w3.org/TR/html5/forms.html#attr-input-checked :

O atributo de conteúdo desativado é um atributo booleano.

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

A presença de um atributo booleano em um elemento representa o valor verdadeiro e a ausência do atributo representa o valor falso.

Se o atributo estiver presente, seu valor deverá ser a sequência vazia ou um valor que não diferencia maiúsculas de minúsculas ASCII do nome canônico do atributo, sem espaços em branco à esquerda ou à direita.

Conclusão :

A seguir, são válidos, equivalentes e verdadeiros :

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

O seguinte é inválido :

<input type="checkbox" checked="0" />
<input type="checkbox" checked="1" />
<input type="checkbox" checked="false" />
<input type="checkbox" checked="true" />

A ausência do atributo é a única sintaxe válida para false :

<input />

Recomendação

Se você se preocupa em escrever um XHTML válido, use checked="checked", pois ele <input checked>é XHTML inválido (mas HTML válido) e outras alternativas são menos legíveis. Senão, basta usar <input checked>, pois é mais curto.

<input ... checked />
<input ... checked="checked" />

Esses são igualmente válidos. E em JavaScript:

input.checked = true;
input.setAttribute("checked");
input.setAttribute("checked","checked");

você quer isso eu acho: checked='checked'

1. verificado
2. verificado = ""

3. verificado = "verificado"

   são equivalentes;

de acordo com a caixa de seleção spec '---- ⓘ marcada = "marcada" ou "" (sequência vazia) ou vazia Especifica que o elemento representa um controle selecionado .---'

É uma cidade muito louca que a única maneira de tornar falso verificado é omitir quaisquer valores. Com o Angular 1.x, você pode fazer isso:

  <input type="radio" ng-checked="false">

o que é muito mais sensato, se você precisar desmarcá-lo.

Eu acho que isso pode ajudar:

Em segundo lugar, você precisa estar ciente de que o atributo verificado retorna uma sequência de caracteres "true", "false"
Por que isso é importante? Porque você precisa usar o tipo correto. Uma string, não um booleano. Isso também é importante ao analisar sua caixa de seleção.
$('mycheckbox')[0].checked = "true"

if($('mycheckbox')[0].checked === "true"){ //do something }

Você também precisa perceber que o ATTRIBUTE "marcado" é para definir o valor da caixa de seleção inicialmente. Isso não faz muito quando o elemento é renderizado no DOM. Imagine isso funcionando quando a página da web é carregada e é analisada inicialmente.
Eu vou com a preferência do IE neste:<input type="checkbox" checked="checked"/>

Por fim, o principal aspecto de confusão para uma caixa de seleção é que o elemento UI da caixa de seleção não é o mesmo que o valor da propriedade do elemento. Eles não se correlacionam diretamente. Se você trabalha em .net, descobrirá que o usuário "marcando" uma caixa de seleção nunca reflete o valor real do bool passado ao controlador. Para definir a interface do usuário, eu uso ambos $('mycheckbox').val(true);e$('mycheckbox').attr('checked', 'checked');

Bem, para usá-lo, eu não acho que importa (semelhante a desativado e somente leitura), pessoalmente eu uso o check = = "check", mas se você está tentando manipulá-los com JavaScript, usa true / false