我今天注意到，当与属性选择器结合使用时，jQuery的:visible选择器会显示意外行为。其行为因
而异
a）是否在内联使用或在过滤方法内使用
b）与
示例：
给出以下标记
<input required name="name" type="text" />
以下适用于jQuery
$('[required="required"]').filter(':visible').length == 0; //true
$('[required="required"]:visible').length == 0; //false - why does jquery find the input?
disabled属性显示类似的行为。但是，数据属性不会显示相同的行为：
给出以下标记
<input data-boolean name="name" type="text" />
以下适用于jQuery
$('[data-boolean="true"]').filter(':visible').length == 0; //true
$('[data-boolean="true"]:visible').length == 0; //true
这是指示问题的fiddle的链接。
我不希望[required =＆＃34; required＆＃34;]匹配具有空白必需属性的元素，并且当它自己用作选择器时它不会，但它与：visible选择器配对时会发生什么为什么会这样？
答案 0 :(得分：4)
差异的根本原因似乎是当对正式的默认属性值进行显式测试时，Sizzle（jQuery中的非原生选择器代码）匹配布尔属性，如required。但是，本机querySelectorAll()代码不会，除非该属性实际上具有原始HTML中的值。
像required或readonly这样的布尔选择器可以用HTML表示而没有值，但这意味着该值将被视为属性名称本身。
当您使用像:visible这样的伪类时，Sizzle意识到本机代码不会工作，因此它会接管。导致问题的不是:visible测试本身;你可以通过:text或Sizzle支持的任何其他扩展获得相同的效果（显然不会改变选择器的意义）。
我个人认为这是一个错误，虽然可能有点难以修复，因为当通过required询问DOM节点时，属性值确实被报告为getAttribute()。
如果要使用完全指定的属性精心编写HTML代码：
<input required=required ...>
然后就没有明显的区别，但这似乎有点麻烦。