-2

У меня есть фильтр товаров.
Помогите передалать в местах где forEach на цикл for.
Прошу дубликатом не отмечать, я похожий ответ видел, пробовал аналогично сделать, но у меня ошибка в коде.
Прокомментировал в тех местах, где он есть.

    addEventListener("load", function () {
  var check = true;
  document.querySelector(".filter").addEventListener("click", function (_ref) {
    var target = _ref.target;
    var el = target.closest("[data-filter]");
    if (!el) return;
    var cls = target.dataset.filter;

    if (cls == "all") {
      document.querySelectorAll(".btn").forEach(function (btn) { // 1
        return btn.checked = check;
      });
      check = !check;
    }

    var sel = ".placeholder";
    document.querySelectorAll(sel).forEach(function (el) { //2
      return el.classList.add("hide");
    });
    document.querySelectorAll(".btn:checked").forEach(function (btn) { //3
      cls = btn.dataset.filter;
      document.querySelectorAll(sel + "." + cls).forEach(function (el) { //4
        return el.classList.remove("hide");
      });
    });
  });
});

2 ответа 2

1

Цикл for..of

for (let el of document.querySelectorAll(sel)) {
  // Работаете с элементом el
}
0
 window.addEventListener("load", function () {
  var check = true;
  document.querySelector(".filter").addEventListener("click", function (_ref) {
    var target = _ref.target;
    var el = target.closest("[data-filter]");
    if (!el) return;
    var cls = target.dataset.filter;

    if (cls == "all") {
      var button = document.querySelectorAll(".btn");

      for (let i = 0; i < button.length; i++) {
        button[i].checked = check;
      }

      check = !check;
    }

    var sel = ".placeholder";
    var element = document.querySelectorAll(sel);

    for (let i = 0; i < element.length; i++) {
      element[i].classList.add("hide");
    }

    var btn = document.querySelectorAll(".btn:checked");

    for(let i = 0; i < btn.length; i++) {
      cls = btn[i].dataset.filter;
      var el = document.querySelectorAll(sel + "." + cls);

      for (let j = 0; j < el.length; j++) {
        el[j].classList.remove("hide");
      }
    }
  });
});

По идее так

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.