Question

假设我有以下html：

<img onclick="showStruct(this)" class="expand" src="Images/Plus.png" data-hidden="true" style="display: none;">
<img onclick="showStruct(this)" class="expand" src="Images/Plus.png" data-hidden="false" style="display: inline;">
<img onclick="showStruct(this)" class="expand" src="Images/Plus.png" data-hidden="true" style="display: none;">

如果元素被隐藏，我将true存储在data-hidden字段中，因为我必须同时隐藏所有元素并将{state}存储在data-hidden字段中，我确保我知道要再展示哪些。即：

<img onclick="showStruct(this)" class="expand" src="Images/Plus.png" data-hidden="true" style="display: none;">
<img onclick="showStruct(this)" class="expand" src="Images/Plus.png" data-hidden="false" style="display: none;">
<img onclick="showStruct(this)" class="expand" src="Images/Plus.png" data-hidden="true" style="display: none;">

我要做的是，通过使用jquery，仅为display: inline;的元素设置data-hidden: 'false'？

我拥有的（有效）：

$(".expanded").each
    (function() {
        if($(this).attr('data-hidden')=='false'){
            $('.expanded').show();
        }
    });

我的问题是，是否有更好的（更有效的）方法，或者这是唯一的方法呢？

Answer 1

您只需使用attribute selector

即可

$('.expanded[data-hidden="false"]').show()

演示：Fiddle

Answer 2

试试这个，

$(".expanded").filter(function(){
   return $(this).data('hidden') == 'false';
}).show();

使用具有某些'data- *'的元素调用类上的函数

2 个答案: