查询选择器对数值的错误 [英] Error while query selector on numeric value

问题描述

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

I am trying to set checkbox value for a filter component using query selector (without jquery). If the value for the element is string then query selection is success however if it is a numeric it fails.

<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;
 })

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

Uncaught DOMException: Failed to execute 'querySelector' on 'Document': 'input[name=storage][value=16]' is not a valid selector.

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

推荐答案

你可能在选择器的值中使用：`[key =value]

You might use " in the value of your selector : `[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;
})

这篇关于查询选择器对数值的错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！