Как добавить картинку в массив js

 id="image-container">

Теперь напишем js код:

// Создаем элемент изображения const img = document.createElement('img'); // Устанавливаем путь к изображению img.src = 'path/to/image.jpg'; // Устанавливаем альтернативный текст для изображения img.alt = 'Описание изображения'; // Получаем контейнер, куда нужно вставить изображение const container = document.querySelector('#image-container'); // Вставляем изображение в контейнер container.append(img); 

Этот код создаст элемент , устанавливает ему путь и альтернативный текст, а затем добавляет его в контейнер, который имеет идентификатор image-container .

Как создать массив из картинок?

Нужно сделать так что если а == банан то выводит картинку. Это не обязательно писать мне бы разобраться как создавать массив из картинок и выводить их все.

Лучшие ответы ( 1 )
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
Ответы с готовыми решениями:

Как создать слайдер из картинок?
Здравствуйте Уважаемые Вебмастера! Скачал с официального сайта ‘Орифлэйм’ каталог.

Как сделать массив из картинок?
есть html код(4 фотки с id img и все в div классе): в css: #img и javascript.

Создать массив таких картинок
есть файл, в котором с новой строчки записан путь к картинке, если она потребуется на форме, и "-".

Как создать фоновый рисунок из двух картинок?
Доброе утро. Подскажите, пожалуйста, как создать фоновый рисунок как на картинке. Необходимо чтобы.

186 / 107 / 43
Регистрация: 02.05.2019
Сообщений: 168

Создаете массив из путей к файлам, например

let arr = ['/images/img-1.jpg', '/images/img-2.jpg'];

Потом меняете атрибут src у img и все.
Регистрация: 03.03.2019
Сообщений: 27
let arr = [‘d.jpg’, ‘b.jpg’];
Массив создать получилось. Теперь как его вывести в этот блок ?
186 / 107 / 43
Регистрация: 02.05.2019
Сообщений: 168

Сообщение было отмечено Timyr_filatov как решение

Решение

1 2 3 4 5 6 7 8 9

let arr = ['/images/img-1.jpg', '/images/img-2.jpg']; let pictureContainer = document.getElementById("picture"); arr.forEach(i=>{ let img = document.createElement("img"); img.setAttribute("src", i); pictureContainer.appendChild(img); });

Регистрация: 03.03.2019
Сообщений: 27

document.getElementById(‘picture’).innerHTML=’ ‘ выводит размеры а картинку не выводит как это исправить? Почти уже получилось осталось немного. Не могу сообразить как это довести до ума.

Добавлено через 32 секунды
Сейчас попробую)

186 / 107 / 43
Регистрация: 02.05.2019
Сообщений: 168

У вас очепятка в атрибуте SRC
И его значение тоже не верно написано. scr=»d.jpg», если стоит слэш в начале scr=»/d.jpg» это говорит о корне сервера. Без сервера в браузере это путь к диску.

Регистрация: 03.03.2019
Сообщений: 27

Добавлено через 5 часов 40 минут
Только у меня теперь возникла маленькая проблема. Вот создан массив и вывожу их туда куда мне надо, они то выводятся но предыдущая картинка не удаляется. Вот например ввожу я груша появляется картинка груша, потом ввожу банан появляется картинка банан но только рядом а мне нужно что-бы появлялось место картинки груша, как это сделать)?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

let arr = ['img/grucha.jpg', 'img/banan.jpg']; let pictureContainer = document.getElementById("picture"); let img1 = document.createElement("img"); let img2 = document.createElement("img"); img1.setAttribute("src", arr[0]); img2.setAttribute("src", arr[1]); switch(a1){ case 'груша': {alert("Правильно"); pictureContainer.appendChild(img1);}break; case 'банан': {alert("Правильно"); pictureContainer.appendChild(img2);}break;

Слайдер картинок через массив на JavaScript

Давайте теперь сделаем слайдер картинок. Пусть в HTML коде у нас дан тег img :

Пусть также у нас дан массив картинок:

let texts = [‘1.png’, ‘2.png’, ‘3.png’];

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

Реализуйте описанный слайдер. Сделайте так, чтобы картинки ходили по кругу.

Модифицируйте предыдущую задачу так, чтобы над картинкой также появились стрелки вперед и назад. То есть слайдер будет сам проматываться таймером, но при желании юзер также сможет промотать его ссылками.

Курсы javascript

Возможно ли такое, можно же создать массив из чисел и из строк.
Как можно создать массив из картинок?

09.09.2011, 23:30

Регистрация: 30.08.2011

Сообщений: 61

Также, как из чисел и строк:

var array = new Array(); var image = new Image(); image.src = "example.jpg"; // картинка закэширована, но ещё не в dom'е array.push(image);

var array = document.getElementsByTagName('img'); // выбрать вообще все картинки (теги img) на странице

Последний раз редактировалось crayday, 09.09.2011 в 23:38 . Причина: написал вначале не кроссбраузерный пример

10.09.2011, 01:00

Регистрация: 28.03.2011

Сообщений: 5,418

//myImages - массив var myImages = [].slice.call( document.images, 0 ); // путь к первой картинке myImages[0].src = . // обойдем все картинки myImages.forEach(. ) // добавим новую картинку в массив myImages.push( new Image );