Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.07.2018, 08:40
Профессор
Отправить личное сообщение для s24344 Посмотреть профиль Найти все сообщения от s24344
 
Регистрация: 12.08.2015
Сообщений: 206

Поместить dom элементы в массив после цикла
Ребята, подскажите, как решить следующую задачу:

У меня есть набор dom элементов, которые я получил выборкой:
let images = document.querySelectorAll('.elem)

затем через цикл и условие я отфильтровал лишь нужные мне элементы (в данном случае я вывел те элементы, у которых нет атрибута id):
for (let i = 0; i < images.length; i++) {
  if (images[i].getAttribute('id')) {
    continue
  }

  let pic = images[i]

  console.log(pic)
}

В итоге я получил следующий набор элементов:
<div class="elem">
	<p>1</p>
</div>
<div class="elem">
	<p>2</p>
</div>
<div class="elem">
	<p>3</p>
</div>
<div class="elem">
	<p>1</p>
</div>
<div class="elem">
	<p>2</p>
</div>
<div class="elem">
	<p>3</p>
</div>

Теперь, собственно, вопрос:
Я хочу снова пройтись циклом по этим элементам, но так как это не массив, то:
images[i].length

вернет:
undefined

Как же мне верно реализовать следующую идею?
Ответить с цитированием
  #2 (permalink)  
Старый 04.07.2018, 09:16
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,705

Это не массив, но коллекция.
У коллекции есть свойство length, нужно обращаться не к элементу коллекции, а к самой коллекции: images.length

Стоит отметить, что чем меньше циклов вы используете, тем быстрее будет ваш код исполняться.
Что вам мешает выполнить все манипуляции над элементами в единственном цикле?
Для более удобного перебора элементов коллекции её можно привести к массиву и воспользоваться одним из перебирающих методов.
Коллекцию к массиву можно привести так:
const imagesArray=[].slice.call(images);
Ответить с цитированием
  #3 (permalink)  
Старый 04.07.2018, 09:41
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от s24344
У меня есть набор dom элементов, которые я получил выборкой:
let images = document.querySelectorAll('.elem)


затем через цикл и условие я отфильтровал лишь нужные мне элементы (в данном случае я вывел те элементы, у которых нет атрибута id):
Дык!

images = document.querySelectorAll('.elem:not([id])');
Ответить с цитированием
  #4 (permalink)  
Старый 04.07.2018, 09:57
Профессор
Отправить личное сообщение для s24344 Посмотреть профиль Найти все сообщения от s24344
 
Регистрация: 12.08.2015
Сообщений: 206

Спасибо, ребята. Что касается советов, то я прислушаюсь, так ка ни в коем случае не претендую на то, что мои решения единственно верные )
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не работает hover() после добавление элемента в DOM jeysmook jQuery 17 10.06.2012 15:02
Как обратиться к элементу, который был добавлен после полной загрузки DOM? LysoSutriN jQuery 5 02.01.2012 16:59
Обработка DOM после Ajax-запроса Игорь87 Общие вопросы Javascript 2 05.01.2011 19:23
Отработка скрипта после изменения DOM. Беляш Общие вопросы Javascript 3 15.10.2010 16:56
Не изменяется DOM после назначения класса css в Chrome khusamov Общие вопросы Javascript 5 22.03.2010 20:45