选择具有数据属性 jQuery 的类 - JavaScript

在 JavaScript 中，我们经常需要根据类名来获取 DOM 元素。而当类名与数据相关时，jQuery 提供了具有数据属性的类选择器。

使用方法

$('.class[data-property]')

在上述代码中，.class 代表需要选择的元素类名，[data-property] 代表需要选择的数据属性。

例如，我们有下面这样的 HTML 代码：

<div class="item" data-name="example">Example Item</div>

如果我们想选取所有具有 data-name 属性的 item 类元素，我们可以使用以下代码：

$('.item[data-name]')

示例

下面是一个简单的示例，展示了如何使用具有数据属性的类选择器来选取元素：

<div class="item" data-name="example1">Example Item 1</div>
<div class="item" data-name="example2">Example Item 2</div>
<div class="item" data-name="example3">Example Item 3</div>
<div class="item">Example Item 4</div>

// 选取所有具有 data-name 属性的元素
$('.item[data-name]').css('background', 'yellow');

上述代码将背景色设置为黄色的元素是具有 data-name 属性的前三个元素。

总结

以上就是如何使用 jQuery 选择具有数据属性的类的方法。这是一个非常实用的选择器，可以帮助您快速准确地筛选出需要的元素。