如何将querySelectorAll仅用于具有特定属性集的元素？

我试图使用document.querySelectorAll所有具有value属性设置的checkbox。

页面上还有其他checkbox没有设置值，每个checkbox的值都不相同。 ID和名称不是唯一的。

例如： <input type="checkbox" id="c2" name="c2" value="DE039230952"/>

如何只select那些设置了值的checkbox？

Answer 1

你可以像这样使用querySelectorAll() ：

 var test = document.querySelectorAll('input[value][type="checkbox"]:not([value=""])'); 

这转化为：

获得所有具有属性“值”的input，并具有非空白的属性“值”。

在这个演示中 ，它将禁用非空值的checkbox。

Answer 2

额外提示：

多个“nots”，不隐藏和不禁用的input：

 :not([type="hidden"]):not([disabled]) 

你也知道你可以这样做：

 node.parentNode.querySelectorAll('div'); 

这与jQuery的相同：

 $(node).parent().find('div'); 

这将有效地find在“节点”和以下recursion的所有div，HOT DANM！

Answer 3

用于input的document.querySelectorAll()仅默认返回检查的input。

问候;）