jQuery - 在 each() 循环中选择具有“隐藏”属性的 DOM 元素

Question

我需要选择所有<select>添加了“隐藏”属性的元素。这是标记：

<optgroup label="Label 1">
    <option value="978" hidden>Option 1</option>
    <option value="987" hidden>Option 2</option>
    <option value="987" hidden>Option 3</option>
    <option value="987">Option 4</option>
</optgroup>

我只展示了一个<optgroup>，但标记中有很多。

到目前为止，我想出了这个代码：

jQuery('optgroup').each(function() {
    var options = jQuery(this).find('option');
    jQuery.each(options, function(index, value) {
        if ($(value).data('hidden') !== undefined) {
            console.log('Found it!');
        }
   });
});

不幸的是，里面的代码条件永远不是真的。我在这里缺少什么？

Answer 1

使用属性存在选择器- 下面的选择器将遍历所有option具有该hidden属性并且是optgroup元素后代的元素

jQuery('optgroup option[hidden]').each(function () {
    console.log('Found it!', this);
});

保持你的结构

jQuery('optgroup').each(function () {
    jQuery(this).find('option').each(function () {
        if (jQuery(this).is('[hidden]')) {
            console.log('Found it!');
        }
    });
});