javascript - 错误选择包含类的 div

Question

1. 查找包含具有特定类的“a”元素的 div(此步骤已成功)

2. 对于该特定 div(包含具有特定类的“a”元素)，应该找到另一个类，并为其删除一个类。此步骤失败，因为所有包含 filter-options-title 类的 div 将丢失“封闭”类。

   <script>
       require(["jquery"], function ($) {
               if ($("div.filter-optie").find('.shopby_link_selected')) {
                   $("div.filter-optie").find('.filter-options-title').removeClass('closed'); //this should only happen when the 'a' element with class shopby_link_selected has been found, which is not happening right now with this piece of code.
               }
       });
   </script>
   

我可以实现什么想法，以使其更加强大，并使其达到我想要的效果？

附上 HTML:

<div class="filter-optie">
    <dt role="heading" aria-level="3" class="filter-options-title closed">
        <label class="active" for="layered-filter-merk">BRAND</label>
    </dt>
    <dd class="filter-options-content">
        <ol class="items shopby_filter_items_attr_merk">
            <form data-shopby-filter="attr_merk" data-shopby-filter-request-var="merk">
            <li class="item" data-label="LABEL">
                <a class="shopby_filter_item_5cd9ce0ea7fbd shopby_link_selected" href="">
                <input name="shopby[brand][]" value="3989" type="radio" style="" checked="">
                <span class="label">XXXX</span>
                <span class="count">4<span class="filter-count-label">PRODUCTS</span></span>
                </a>
            </li>
            </form>
        </ol>
    </dd>
</div>

Answer 1

@DigitalJedi，几乎是正确的，因为这将从所有存在 .shopby_link_selected 的地方删除 .close 类，但我相信根据您的 html DOM 遍历不正确。

$("div.filter-optie .shopby_link_selected").each(function() {
  $(this).closest('.filter-optie).find('.filter-options-title').removeClass('closed');
});

这将找到所有具有 .shopby_link_selected 类的 anchor 标记，然后对于每个标记，它将在 DOM 中搜索父 .filter-optie然后返回 .filter-options-title 的 DOM 并删除 .close 类。