javascript - 如何使用 jquery 创建我的图像数组？

Question

如何使用 jquery 遍历我的图像并使用“title”和“src”值创建一个数组？

这是我的图片列表:

<div id="myImages">
  <img data-title="1" src="1.jpg" alt="">
  <img data-title="2" src="2.jpg" alt="">
  <img data-title="3" src="3.jpg" alt="">
  <img data-title="4" src="4.jpg" alt="">
</div>

这就是我需要的数组:

[ { "title" : "1", "image" : "1.jpg", }, { "title" : "2", "image" : "2.jpg", }, { "title" : "3", "image" : "3.jpg", }, { "title" : "4", "image" : "4.jpg", } ]

Answer 1

使用.map()将一组dom元素转换为不同的表示

var array = $('#myImages img').map(function () {
    var $this = $(this);
    return {
        title: $this.data('title'),
        image: $this.attr('src')
    }
}).get();

演示:Fiddle