在jQuery中将所有hrefs作为数组获取答案

【问题标题】：Get all hrefs as an array in jQuery在jQuery中将所有hrefs作为数组获取
【发布时间】：2010-10-03 01:33:18
【问题描述】：

我的代码如下所示：

<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>

现在我想得到以下内容：

所有链接作为一个数组

li的所有id作为一个数组

有人可以帮帮我吗？

【问题讨论】：

标签： jquery html

【解决方案1】：

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

【讨论】：

【解决方案2】：

我知道这是旧的，但由于我喜欢 jQuery 允许您编写的单行器，我想我会添加它：

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();

【讨论】：

+1 但是allLinks 和allIds 是类jQuery 数组对象，它们不是真正的javascript 数组。要返回真正的javascript数组，需要allLinks = $.makeArray(allLinks);和allIds = $.makeArray(allIds);
你不需要使用$.makeArray()，你可以在map()之后调用.get()

【解决方案3】：

偶然发现这个问题，想出了一个更可重用的答案：

$.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');

您也可以像这样将函数传递给 collect：

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

【讨论】：

【解决方案4】：

这应该可行。

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']

【讨论】：

【解决方案5】：

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);
}

【讨论】：

【解决方案6】：

如果你喜欢一个衬里并且讨厌必须实例化一个空数组。

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

【讨论】：

【解决方案7】：

与 Grimace 提供的代码相同，但在 ES6 中

const allLinks = $('#ulList a').map((i,el) => $(el).attr('href')).get();
const allIds = $('#ulList li').map((i,el) => $(el).attr('id')).get();

【讨论】：

【解决方案8】：

我是来找单线的。这是我想出的：

var hs=[]; $('a').each(function(i,a){hs.push(a.href);}); hs;

【讨论】：