带detach()的筛选类别

Question

帮助我完成detach ()函数。

我知道了它是如何工作的，但我在应用它时需要帮助，在我的例子中，它删除了所有选定的类别，但您需要做相反的操作，以便删除除选定类别之外的所有类别。是否有必要将除选定的类之外的所有内容都放入类中，并使用detach ()或其他更好的方法？

html

<div class="blog-filter">
    <div class="blog-filter_item active js-filter-blog-list" data-filter="all">All</div>
</div>
<div class="blog-filter-container">
<div class="container">
    <h1 class="blog-filter-title">Choose Category</h1>
    <div class="item-wrapper">
        <div class="blog-filter_item active" data-filter="all">All</div>
        @foreach($categories as $category)
        <div class="blog-filter_item" data-filter=".category_{{$category->id}}">{{ $category->title }} ({{ $category->articles_count }})</div>
        @endforeach
    </div>
</div>
</div>

<div class="blog-list">
@foreach($articles as $article)
        <div class="blog-article category_{{ $article->blog_category_id }}">
            <h2 class="blog-article__title">{{ $article->title }}</h2>
        </div>
@endforeach
</div>

js

var divs;
    
$('.blog-article').each(function(i){
  $(this).data('initial-index', i);
});

document.querySelectorAll('.blog-filter_item').forEach(el => {
  el.addEventListener('click', () => {
    document
      .querySelector('.blog-filter_item.active')
      .classList.remove('active');
    el.classList.add('active');

      var dataFilter = $(el).attr('data-filter');

      $(divs).appendTo('.blog-list').each(function(){
        var oldIndex = $(this).data('initial-index');
          $('.blog-article').eq(oldIndex).before(this);
        });
      divs = null;

      if (dataFilter == 'all') {
        $('.blog-article').show();
      }
      else {
        divs = $(dataFilter).detach();
        $('.blog-article').show(); 
      }
  });
});

Answer 1

解决方案：

divs = $('.blog-article').not(dataFilter).detach();