Помогите переписать код JQUERY на Javascript [закрыт]

105

07 марта 2021, 17:30

Закрыт. Этот вопрос не по теме. Ответы на него в данный момент не принимаются.

Хотите улучшить этот вопрос? Обновите вопрос так, чтобы он вписывался в тематику Stack Overflow на русском.

Закрыт 1 год назад.

Улучшить вопрос

Есть код Jquery

$('.filters a').on('click', function() {
  $('.filters li').removeClass('active');
  $(this).parent('li').addClass('active'); 
  var cat = $(this).attr('data-filter'); 
  if (cat == 'all') { // если all
    $('.pokemon-item').show(); 
  } else { 
    $('.pokemon-item').hide();
    $('.pokemon-item[data-filter="' + cat + '"]').show(); 
      }
    });

И часть кода HTML

<ul class="filters">
        <span>FILTER BY TYPE:</span>
          <li class="active"><a data-filter="all">All</a></li>
          <li><a data-filter="endur-pok">Endurance</a></li>
          <li><a data-filter="power-pok">Power</a></li>
          <li><a data-filter="shadow-pok">Shadow</a></li>
</ul>
<div class="pokemon-item" data-filter="endur-pok">
</div>
<div class="pokemon-item" data-filter="shadow-pok">
</div>
<div class="pokemon-item" data-filter="speed-pok">
</div>

Answer 1

Ключевое слово "помогите"? ))

Вызов метода $('selector') можно переписать методом querySelectorAll
Установка обработчика события (в вашем случае click) - addEventListener()
С методами removeClass()/addClass() поможет свойство classList уже со своими методами add() и remove()
Для замены методов show() / hide() вполне подойдёт свойство элемента style
Доступ к data-атрибутам решается использованием свойства dataset