Obtener todos hrefs como una matriz en jQuery

Question

Mi código es el siguiente:

<ul id="ulList"> 
    <li class="listClass" id="id1"><a href="http://link1">Link 1</a></li> 
    <li class="listClass" id="id2"><a href="http://link2">Link 2</a></li> 
    <li class="listClass" id="id3"><a href="http://link3">Link 3</a></li> 
</ul> 

Ahora me gustaría obtener el siguiente:

Todos los enlaces como una matriz

todos los ID de li como una matriz

¿Alguien me puede ayudar, por favor?

Answer 1

Esto debería funcionar.

var ids = [], 
    hrefs = [] 
; 
$('#ulList') 
    .find('a[href]') // only target <a>s which have a href attribute 
     .each(function() { 
      hrefs.push(this.href); 
     }) 
    .end() 
    .find('li[id]') // only target <li>s which have an id attribute 
     .each(function() { 
      ids.push(this.id); 
     }) 
; 

// ids = ['id1', 'id2', 'id3'] 
// hrefs = ['http://link1', 'http://link2', 'http://link3'] 

Answer 2

 
var ids = new Array(); 
var hrefs = new Array(); 
$('#ulList li').each(function(){ 
    ids.push($(this).attr('id')); 
    hrefs.push($(this).find('a').attr('href')); 
}) 

Answer 3

var links = [], ids = []; 
var $ul = $('#ulList'); 
var $lis = $ul.children('li'); 
var $as = $lis.children('a'); 

for(var count = $lis.length-1, i = count; i >= 0; i--){ 
    ids.push($lis[i].id); 
    links.push($as[i].href); 
} 

Answer 4

tropezado con esta pregunta y se le ocurrió una respuesta más reutilizable:

$.fn.collect = function(fn) { 
    var values = []; 

    if (typeof fn == 'string') { 
     var prop = fn; 
     fn = function() { return this.attr(prop); }; 
    } 

    $(this).each(function() { 
     var val = fn.call($(this)); 
     values.push(val); 
    }); 
    return values; 
}; 

var ids = $('#ulList li').collect('id'); 
var links = $('#ulList a').collect('href'); 

También puede pasar una función a cobro revertido de esta manera:

var widths = $('#ulList li').collect(function() { 
    return this.width(); 
}); 

Answer 5

Sé que esto es viejo, pero como me gustan los jinetes que jQ uery le permite escribir, pensé que me gustaría añadir que:

var allLinks = $('#ulList a').map(function(i,el) { return $(el).attr('href'); }).get(); 
var allIds = $('#ulList li').map(function(i,el) { return $(el).attr('id'); }).get(); 

Answer 6

Si te gusta trazadores de líneas uno y odio tener que crear una instancia de una matriz vacía.

[] 
    .slice 
    .call($('#ulList a')) 
    .map(el => el.getAttribute('href'))