JS/jQuery - Массив из Dom-элементов

404

22 октября 2017, 23:43

Есть такой код в HTML:

<div id="slider">
  <img src="images/user1.jpg" style="opacity:0.5" width="90px" height="90px">
  <img src="images/user2.jpg" width="90px" height="90px">
  <img src="images/user3.jpg" style="opacity:0.5" width="90px" height="90px">
</div>

Как сделать из этих изображений массив на JS/JQ?

Answer 1

JavaScript

var container = document.getElementById("slider"); 
console.log(Array.from(container.children));

<div id="slider"> 
  <img src="images/user1.jpg" style="opacity:0.5" width="90px" height="90px"> 
  <img src="images/user2.jpg" width="90px" height="90px"> 
  <img src="images/user3.jpg" style="opacity:0.5" width="90px" height="90px"> 
</div>

jQuery

console.log($("#slider").children().toArray())

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="slider"> 
  <img src="images/user1.jpg" style="opacity:0.5" width="90px" height="90px"> 
  <img src="images/user2.jpg" width="90px" height="90px"> 
  <img src="images/user3.jpg" style="opacity:0.5" width="90px" height="90px"> 
</div>

Answer 2

var imgArray = [];
$.each($('div#slider img'), function (index, element){
 imgArray.push($(element).attr('src'));
});
console.log(imgArray);

Создание интернет-магазина строительных материалов в ABCname

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Scroll к элементу при загрузке страницы

В браузере firefox, все работает хорошо при загрузке страницы все скролится к нужному элементу, но в webkit не работает, только если вызывать через...

401

javascript

Адаптивное меню на js

Нигде не нашёл как сделать адаптивное меню на чистом js(Cкриншоты ниже)

714

javascript

Как улучшить функцию

402

javascript

как изменить функцию?

Подскажите как изменить функцию:

342