通过querySelectorAll上的ID排除特定元素

Question

我尝试从中获取数组的长度：

document.querySelectorAll('select,input,textarea');
alert(Object.keys(arr).length);//19

在该数组中，我必须排除4个元素，分别为2 input type="hidden"和2与specif id's，所以我尝试使用:not selector：

document.querySelectorAll('select,input,textarea,input:not[type="hidden",input:not[id="input_up_img_perfil"],input:not[id="sub_img_perfil"],');
alert(Object.keys(arr).length);//19

该查询正确的sintax是什么？

Answer 1

尝试这个：

document.querySelectorAll('select,input:not([type="hidden"]):not(#input_up_img_perfil):not(#sub_img_perfil),textarea');

它应该可以正常工作;）

这实际上很简单：首先，您需要在:not运算符上加上括号。然后，您需要考虑适当的CSS查询以选择所需的内容。

无效的示例：

'input:not([type="hidden"]),input:not(#input_up_img_perfil),input:not(#sub_img_perfil)'

因为您实际上有三个查询，并且结果将在最后合并，因为input:not(#input_up_img_perfil)对隐藏字段没有限制，因此即使您设置了，也可以在结果中获取它们input:not([type="hidden"])。

因此，您需要执行以下操作：

'input:not([type="hidden"]):not(#input_up_img_perfil):not(#sub_img_perfil)'

在这里，您对输入标签只有一个查询，有三个约束！

希望这很清楚;）