Foreach элемент в массиве изображений

var str = '01.jpg,02.jpg,03.jpg';
var arr = [str.split(',')];
var cnt = '';
arr.forEach(function(el){
		cnt += "<img class = 'imgall' src = 'imgt/" + el + "' alt='img'>";
	});
	console.info(cnt);

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Что мне нужно в консоли:

<img class='imgall' src='imgt/01.jpg' alt='img'>
<img class='imgall' src='imgt/02.jpg' alt='img'>
<img class='imgall' src='imgt/03.jpg' alt='img'>

Любая помощь?

1. Это не имеет ничего общего с jQuery, 2. просто не переносите возвращаемое значение .split() (которое уже является массивом) в массив.

— 13.07.2019 11:14

javascript arrays

13.07.2019 11:13

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

132

Перейти к ответу Данный вопрос помечен как решенный

Ответы 5

//correct usage;
var arr = str.split(',');

var str = '01.jpg,02.jpg,03.jpg';
var arr = str.split(',');
var cnt = '';
arr.forEach(function(el){
		cnt += "<img class = 'imgall' src = 'imgt/" + el + "' alt='img'>";
	});
	console.info(cnt);

13.07.2019 11:16

Ответ принят как подходящий

Вам не нужно оборачивать результат разбиения в другой массив (поскольку результатом разбиения является массив), и вы можете сопоставить элементы и позже соединить их в одну строку.

var str = '01.jpg,02.jpg,03.jpg';
    arr = str.split(',');
    cnt = arr
        .map(function (el) {
            return '<img class = "imgall" src = "imgt/' + el + '" alt = "img">';
        })
        .join('\n'); // take later '', without newline

console.info(cnt);

ES6 с литерал шаблона

var str = '01.jpg,02.jpg,03.jpg';
    result = str
        .split(',')
        .map(s => `<img class = "imgall" src = "imgt/${s}" alt = "img">`)
        .join('\n'); // take later '', without newline

console.info(result);

13.07.2019 11:16

var str = '01.jpg,02.jpg,03.jpg';
var arr = str.split(',');
var cnt = '';

for(var i=0;i<arr.length;i++)
{
		cnt += "<img class = 'imgall' src = 'imgt/" + arr[i] + "' alt='img'>";
}

console.info(cnt);

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

13.07.2019 11:18

Сделайте с вашим собственным существующим кодом, просто удалите [] из str.split(',');, потому что str.split(',') уже создает множество, поэтому нет необходимости обертывать его еще одной дополнительной записью массива. Хотя я просто добавил лишний \n больше ничего.

var str = '01.jpg,02.jpg,03.jpg';
var arr = str.split(',');//see the change here
var cnt = '';

arr.forEach(function(el) {
  cnt += "<img class = 'imgall' src = 'imgt/" + el + "' alt='img'>\n";
});
console.info(cnt);

13.07.2019 11:18

Если вам нужна коллекция элементов DOM в массиве, просто попробуйте этот код:

var str = '01.jpg,02.jpg,03.jpg';
var arr = str.split(',');

var values = arr.map(function(image) {
  var img =  document.createElement('img')
  img.src = "/imgt" + image;
  img.alt = "img";
  return img;
})

console.info(values)

13.07.2019 11:22

Другие вопросы по теме

PHP Получить самую длинную строку в массиве без цикла

VBA: ожидаемая ошибка массива, несмотря на отсутствие массивов

Ошибка неполного типа при сохранении массива T в структуре T

Суммирование Эйнштейна в numpy для нелинейной функции

Перебор многомерного массива — PHP

Проблема с передачей массива в функцию

Как запросить у пользователя ввод и отменить этот ввод

У меня есть массив символов, и я хочу вставить еще два пробела для каждого пробела

Добавление переменной в список на основе условия python3

Массив Боулинг Счет

Foreach элемент в массиве изображений

Ответы 5

Другие вопросы по теме

Похожие вопросы