@funkydance

Как вывести через for цикл элементы?

На сайте - клац через JS реализовал вывод дат доставки. Но, столкнулся с проблемой. Выводится только у первой записи.

var day = document.querySelector(".day"); - Тут хранятся дни доставки. Я получаю эти дни и если они есть, то создаю изображение этого дня в диве с классом dayimage.

var dayimage = document.querySelector(".dayimage");

Для первой записи работает всё отлично. А вот для остальных нет. Пробовал через цикл for подсчитывать количество элементов day в разметке и это количество подставлять в dayimage[i]. В итоге не вышло и я запутался.

var day = document.querySelector(".day");
var dayimage = document.querySelector(".dayimage");

if (day.textContent.indexOf('пн') !== -1) {
  	var image = document.createElement('img');
        image.src = 'https://fermeda.ru/iconfood/pnr.png';
			dayimage.appendChild(image);
} else {
  	var image = document.createElement('img');
        image.src = 'https://fermeda.ru/iconfood/pnn.png';
        dayimage.appendChild(image);
}
  • Вопрос задан
  • 231 просмотр
Пригласить эксперта
Ответы на вопрос 4
document.querySelectorприменяется к одному элементу, если вам необходимо несколько элементов, заюзайте document.querySelectorAll Потом проверяете количество элементов и крутите цикл.

Почитать о методе - https://developer.mozilla.org/ru/docs/Web/API/Docu...
Ответ написан
@Lynatik001
$('.info').each((i, elem) => {
      sports.push([$(elem).text()])
}

вот как я в jQery недавно перебирал все елементы с классом info.
Ответ написан
wapster92
@wapster92 Куратор тега JavaScript
Сверстаю что-нибудь интересное на халяву
У тебя разметка под эту задачу не очень, в ней нужно искать соседний элемент и от него отталкиваться. А пробежаться по элементам и подставить в дочерний можно вот так
Ответ написан
Tim-A-2020
@Tim-A-2020
var day = document.querySelectorAll(".day");
for(let i = 0; i < day.length; i++) {
    console.log( day[i] )
}


Можно превратить в массив и использовать методы массивов. Например:
[... document.querySelectorAll(".day")].map( item => console.log(item))


Для более подробного ответа скидывайте разметку и описание

upd:
const createImage = url => {
  let image = document.createElement('img');
  image.src = url;
  dayimage.appendChild(image);
}

document.querySelectorAll(".day").forEach(item => item.textContent.indexOf('пн') + 1 ? createImage('https://fermeda.ru/iconfood/pnr.png') : createImage('https://fermeda.ru/iconfood/pnn.png'))
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы