$（＆＃39; .input：checked＆＃39;）的行为与$（＆＃39; .input [checked = checked]＆＃39;）的行为不同

Question

采取以下方案：您有2个单选按钮，两个名称相同，并且都已选中（我发现这些按钮无效）：

<input type="radio" class="input" name="cb1" checked="checked" />
<input type="radio" class="input" name="cb1" checked="checked" />

为什么以下两个选择器的行为不同？

$('.input:checked').size(); // returns 1
$('.input[checked=checked]').size(); // returns 2

显然，第一个选择器只返回标记中最后出现的复选框，而第一个选择器返回两者。

Answer 1

这是因为:checked选择器会检查元素which is different from the checked attribute的checked 属性。

Answer 2

由于两个元素具有相同的名称，因此它们作为单个单元起作用，在渲染元素时实际上只选择了一个单选按钮。

.input[checked=checked]不关心结果，只是检查属性。

.input:checked反映了实际的元素状态。

将name更改为不同，两个查询都将返回2。