jquery - 如何获取data-ZZZ不为空的元素

Question

我有看起来像这样的html：

<div id="1" class="lineItem" data-options="">Line1</div>
<div id="2" class="lineItem" data-options="{size: M;}">Line2</div>
<div id="3" class="lineItem" data-options="{color: black;}">Line3</div>

我可以构造某种选择器来获取<div id="2">and<div id="3">吗？

就像是：

$('.lineItem[data-options='not blank']')

这是可能的，还是我必须手动检查每个 DIV 以检查 data-options 属性是否为空？

Answer 1

您可以使用:not选择器

$('.lineItem[data-options]:not([data-options=""])');

小提琴

Answer 2

使用这个选择器

$(".lineItem[data-options!='']")

Answer 3

我建议：

$('.lineItem').filter(
    function(){
        return $(this).attr('data-options').length;
    });

JS 小提琴演示。

但是，这确实会查看选择器返回的每个元素，并评估data-options属性以检查它是否不为空（或者，明确地，它的长度大于0）。