为什么* [checked]表现得像：使用jQuery的过滤方法时检查过？

Question

从previous question开始 假设我在装有jQuery 1.5.2的页面上有两个复选框

<input id="test1" type="checkbox"/>
<input id="test2" type="checkbox"/>

然后让我们点击它们以给每个checked属性。 现在让我们抓住所有复选框并过滤掉未选中的复选框

var numOfCheckedBoxes = $("input:checkbox").filter("*[checked]").size();

现在根据previous question的答案，我希望numOfCheckedBoxes等于0，但它等于2。我现在应该使用$("input:checkbox:checked")或$("input:checkbox").filter(":checked")。

这与我做的不同

var numOfCheckedBoxes = $("#test1").filter("*[checked]").size();

将numOfCheckedBoxes设为等于0 这是first scenario in question的jsFiddle。 这是second scenario in question的jsFiddle。

Answer 1

因为在现代浏览器中，DOM选择将使用querySelectorAll完成。

这意味着在进行DOM选择时，*[checked]实际上会查找该特定属性。

在DOM选择中执行':checked'时，您使用的是Sizzle扩展名无效的CSS，因此未使用querySelectorAll，因此使用Sizzle ，它会查看属性以及属性。

---

所以这里的区别在于.filter()没有/不能使用querySelectorAll，这意味着你将获得Sizzle而不是Sizzle给出的专有行为有效的DOM行为。

---

如果querySelectorAll实际上是filter()的兼容性补丁，那就太棒了，但事实并非如此，所以你必须处理导致的不一致。

---

修改

似乎有一个优化，如果针对多个元素调用Sizzle，则使用is()，但如果只使用一个元素，则使用is()。

这很重要，因为matchesSelector会在拥有它的浏览器中使用matchesSelector，而querySelectorAll会给出与Sizzle相同的评价。该评估与{{1}}不同。

Answer 2

('[checked]')检查是否存在checked属性。当选中/取消选中复选框时，浏览器似乎添加/删除此属性。