Аналог prevAll на чистом JS?

Question

Подскажите, есть ли аналог jquery метода prevAll() для нахождения всех предыдущих элементов одного узла ? Приведу пример

let li = document.querySelectorAll("li");

li.forEach(elem => {
  elem.addEventListener("click", function() {
    this.classList.add("active");
  })
})

function prevAll(element) {
  let result = [];

  while (element = element.previousElementSibling);
  result.push(element);
  return result;
}

.active {
  color: red;
}

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</ul>

Как добиться того что б по нажатию на li получить добавления класса не только к текущему элементу но и ко всем предыдущим. Возможен ли тут метод без for ?

Answer 1

const lis = document.querySelectorAll('li')

lis.forEach((q, w) => {
  q.addEventListener('click', () => {
    lis.forEach((e,r) => {
      e.classList.remove('active')
      if(r <= w) {
        e.classList.toggle('active')
      }
    })
  })
})

.active {
  color: red;
}

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</ul>

БЛОГ НА HUSL

Аналог prevAll на чистом JS?

Ответы (1 шт):