如何使用jquery以特定单词开头的数据属性查找和选择所有元素?

I want to find and select all element which have data attribute start with "data-qu" under wrapper div. How can I do this with using jquery?

我希望找到并选择所有具有data属性的元素，从“data-qu”开始，在wrapper div下，如何使用jquery进行操作?

HTML

HTML

<div class="wrapper">
    <div data-qu-lw="1"></div>
    <div data-qu-md="2"></div>
    <div data-res-kl="1"></div>
    <div data-qu-lg="3"></div>
</div>

Is there a way select those, like this $('.wrapper').find('^data-qu') or similar?

有一种选择,这样美元(.wrapper);(“^ data-qu”)或类似的吗?

3 个解决方案

#1

var filteredElements = $('.wrapper > div').filter(function(){
  var attrs = this.attributes;
  for (var i=0; i<attrs.length; i++) {
      if (attrs[i].name.indexOf("data-qu")==0) return true;
  }         
  return false;
});

#2

ref: jQuery attribute name contains

ref: jQuery属性名包含。

you can do like this.

你可以这样做。

$('.wrapper div').filter(function() {
  for (var property in $(this).data()) {
    if (property.indexOf('data-qu') == 0) {
      return true;
    }
  }

  return false;
});

#3

Try utilizing .filter() , test() , Object.keys()

尝试使用.filter()、test()、Object.keys()

$(".wrapper *").filter(function() {
  return /^qu/.test(Object.keys($(this).data())[0])
}).css("color", "aqua")

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="wrapper">
    <div data-qu-lw="1">1</div>
    <div data-qu-md="2">2</div>
    <div data-res-kl="1">1</div>
    <div data-qu-lg="3">3</div>
</div>

#1

var filteredElements = $('.wrapper > div').filter(function(){
  var attrs = this.attributes;
  for (var i=0; i<attrs.length; i++) {
      if (attrs[i].name.indexOf("data-qu")==0) return true;
  }         
  return false;
});

#2