Почему не срабатывает querySelector?

Question

[Shimpanze]

Добрый день!

Есть HTML-разметка:

<div class="foo">
  <div class="bar">...</div>
</div>

Необходимо найти сначала все элементы div.foo на странице, а затем осуществить поиск уже внутри них и найти элементы div.bar.

Пишу:

// ищу сначала div.foo
document.querySelectorAll('div.foo').forEach((e) => {
  // а потом внутри найденных div.foo начинаю искать div.bar
  e.querySelectorAll('div.bar') // - не срабатывает поиск...
});

Подскажите, как правильно искать в данном! случае (именно forEach).

Спасибо!

Answer 1

[Антон Спирин]

Отлично работает

Подскажите, как правильно искать в данном! случае (именно forEach).

Document.querySelectorAll() возвращает NodeList, а NodeList.forEach не поддерживается ie.
Можно использовать метод forEach массива и вызывать его на NodeList:

[].forEach.call(document.querySelectorAll('div.foo'), e => {
  [].forEach.call(e.querySelectorAll('div.bar'), e => console.log(e));
});

Comments

[Сергей delphinpro]

Стоит отметить что Array.from также не поддерживается браузерами IE и Opera. Ну и в мобилках проблемы тоже.

[Антон Спирин]

Сергей delphinpro, что-то я тупанул) Заменил Node.forEach на менее поддерживаемый Array.from. Пожалуй выпилю из ответа. Спасибо!

Answer 2

[Сергей delphinpro]

Работает. jsfiddle.net/0xcmyp16