如何选择具有自定义属性的元素？

Question

我正在尝试使用Javascript选择此复选框

<input type="checkbox" class="cc_filter_checkbox cc_checkbox" data-specid="a1h02000000L"data-spec="BRAND" data-value="Testval">

下面的代码可以工作，但并不理想

const obj = document.querySelector("#collapsea1h02000000L > ul > li:nth-child(2) > div > label > input");

我试过这些

const obj=$('input[data-value=“testval”]')；

$('input[data-value="Testval"]').click();

const obj=document.evaluate（“//input[contains(text(),'testval')]”,document,null,XPathResult.first_ordered_node_type,null).singlenodeValue；

但它们并不起作用。有什么想法能让这件事成功吗？

数据值未硬编码的更新代码

const params = new URLSearchParams(window.location.search);
                       
  if(params.has('brand')) {

     const sel = 'input[data-value="' + param + '"]';
                
     // find the element (checkbox) with the brand name
     const obj = $(sel)[0];  

Answer 1

使用jQuery，您可以通过data-value进行检索。

js lang-js prettyprint-override">const item = $('input[data-value="Testval"]')[0];
console.log(item.value);
item.click();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" class="cc_filter_checkbox cc_checkbox" data-specid="a1h02000000L"data-spec="BRAND" data-value="Testval" value="your-val">