Question

我正在尝试使用查询选择器（没有jquery）为过滤器组件设置复选框值。如果元素的值是字符串，则查询选择成功，但如果它是数字则失败。

--> Toolbar 
--> Viewpager 
--> CircleIndicator

未捕获的DOMException：无法在'Document'上执行'querySelector'：'input [name = storage] [value = 16]'不是有效的选择器。

https://jsfiddle.net/byqwsdog/1/

Answer 1

您可以在选择器的值中使用"：`[key =“value”]

document.querySelector('button').addEventListener('click',function(){
  document.querySelector('input[name="manufacturer"][value="apple"]').checked = true;
  document.querySelector('input[name="storage"][value="16"]').checked = true;
})

Answer 2

请参阅the specification：

属性值必须是CSS标识符或字符串。

在CSS中，标识符（包括元素名称，类和ID）选择器）只能包含字符[a-zA-Z0-9]和ISO 10646 字符U + 00A0和更高，加上连字符（ - ）和下划线（_）; 他们不能以数字，两个连字符或后面的连字符开头一个数字。标识符还可以包含转义字符和任何字符 ISO 10646字符作为数字代码（参见下一项）。例如，标识符“B＆amp; W？”可以写成“B \＆amp; W \？”或“B \ 26 W \ 3F”。

16以数字开头，因此它（与manufacturer，apple和storage不同）不能是标识符。

字符串可以用双引号或单引号书写。

16不是用其中任何一个写的，所以它不是字符串。

您需要引用该号码。

document.querySelector('input[name=storage][value="16"]')

查询选择器对数值的错误

2 个答案: