Проблема с массивом jQuery

Question

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

У меня есть на странице:

<div id="gallery_thumbs"> 
    <a><img src="images/image-1-thumb.jpg" rel="images/image-1.jpg" /></a> 
    <a><img src="images/image-2-thumb.jpg" rel="images/image-2.jpg" /></a> 
    <a><img src="images/image-3-thumb.jpg" rel="images/image-3.jpg" /></a> 
    <a><img src="images/image-4-thumb.jpg" rel="images/image-4.jpg" /></a> 
</div> 

При загрузке страницы мне нужно, чтобы получить все rel атрибуты в #gallery_thumbs a img и добавить их в массив следующим образом:

preload([ 'images/image-1.jpg', 'images/image-2.jpg', 'images/image-3.jpg', 'images/image-4.jpg']); 

Может кто-нибудь Помогите?

Answer 1

Вы можете использовать функцию карты:

$("img").map(function(i,e) { return $(e).attr('rel');}) 

Answer 2

Вы можете использовать .map(), чтобы получить массив строк, которые вы хотите, как это:

var arr = $("#gallery_thumbs img").map(function() { 
      return $(this).attr("rel"); 
      }).get(); 
preload(arr); 

---

<a> без имени или href является недействительным, хотя, почему бы не иметь href идти изображение, которое вы хотите (что грациозно ухудшилось) и предотвратить это действие в JavaScript? Ваша разметка будет выглядеть следующим образом:

<div id="gallery_thumbs"> 
    <a href="images/image-1.jpg"><img src="images/image-1-thumb.jpg" /></a> 
    <a href="images/image-2.jpg"><img src="images/image-2-thumb.jpg" /></a> 
    <a href="images/image-3.jpg"><img src="images/image-3-thumb.jpg" /></a> 
    <a href="images/image-4.jpg"><img src="images/image-4-thumb.jpg" /></a> 
</div> 

Создание сценария выше проще тоже:

var arr = $("#gallery_thumbs a").map(function() { return this.href; }).get(); 
preload(arr);