Javascript 查询选择器在数值上时出错

我试图使用查询选择器（不带jquery）为过滤器组件设置复选框值。如果元素的值为字符串，则查询选择成功，但如果为数字，则查询选择失败

<div>
  <span>Manufacturer</span>
   <label>
   <input type="checkbox" name="manufacturer" value="apple">Apple</label>
</div>

<div>
  <span>Screen Size</span>
   <label>
   <input type="checkbox" value="16" name="storage">16 GB</label>
</div>
<button>Select</button>


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

制造商
苹果
屏幕大小
16 GB
挑选
document.querySelector（'button'）。addEventListener（'click'，function（）{
document.querySelector（'input[name=manufacturer][value=apple]'）。checked=true；
document.querySelector（'input[name=storage][value=16]'）。checked=true；
})

未捕获的DomeException:未能对“文档”执行“querySelector”：“input[name=storage][value=16]”不是有效的选择器

您可以使用

“

作为选择器的值：

[key=“value”]

见：

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

---

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

16

以数字开头，因此它（与

制造商

、

苹果

和

存储

不同）不能作为标识符

---

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

16

不是用这两种语言编写的，因此它不是字符串

---

你需要引用这个数字

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

---

可能重复感谢@stephanen&Quentin

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