使用jQuery选择具有特定数据属性的元素

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用jQuery选择具有特定数据属性的元素相关的知识,希望对你有一定的参考价值。

如何用jQuery选择具有特定数据属性和特殊类的元素?

例如,我想选择这些元素:

<div data-roomid="55" data-status="NoData"></div>
<div data-roomid="55" data-status="Open"></div>
<div data-roomid="55" data-status="Close"></div>

但不是这个:

<div data-roomid="55" data-status="Book"></div>

我的尝试如下:

roomid = 55;
$('[data-roomid="'+ roomid +'"]').each(function(e) {

});

谢谢。

答案

你可以使用:not选择器 - 见下面的演示:

var roomid = 55, status = 'Book';
$('[data-roomid="' + roomid + '"]:not([data-status=' + status + '])').each(function() {
  $(this).css({
    color: 'blue'
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div data-roomid="55" data-status="NoData">NoData</div>
<div data-roomid="55" data-status="Open">Open</div>
<div data-roomid="55" data-status="Close">Close</div>
<div data-roomid="55" data-status="Book">Book</div>
另一答案

这是你在找什么?

$('div:not([data-status=Book])[data-roomid='+ roomid +']')

以上是关于使用jQuery选择具有特定数据属性的元素的主要内容,如果未能解决你的问题,请参考以下文章

jQuery:选择具有不同特定属性的每个元素

JQuery选择器

在不使用 jQuery 的情况下选择具有“data-xxx”属性的所有元素

如何使用 jquery 选择具有或不具有特定“alt”属性的图像

选择具有以特定值开始/结束的 id 属性的元素

使用 jQuery 选择具有不同数据属性的第一个元素