从 jQuery 集合中获取每个元素的属性值，放入数组中

Posted 2023-03-05

【中文标题】从 jQuery 集合中获取每个元素的属性值，放入数组中

【英文标题】：Get the attribute value of each element from a jQuery set, into an array

【发布时间】：2011-07-16 17:18:18

【问题描述】：

如何获取与 jQuery 选择器匹配的所有元素的所有属性（例如 href）？

【参考方案1】：

大概是这样的吧？

var ids = [];

$('.myClass').each(function () 
  ids.push($(this).attr('id')); // ids.push(this.id) would work as well.
);

【讨论】：

你为什么要创建一个 jQuery 对象 ($(this).attr('id')) 而不是简单的原生 this.id？

@David Thomas - 习惯的力量可能比其他任何东西都重要，但我会修改答案。

@DavidThomas: this.id 仅适用于 id 属性，因为 this 是 DOM 注释。对于一般情况，例如href，您需要this.getAttribute('href') 或$(this).attr('href')。

【参考方案2】：

类似

var idArray = $(".someClass").map(function()
    return this.id
).get().join(',');

Working demo

【参考方案3】：

使用 Underscore.js 的更简单的解决方案

例如：获取所有链接文本谁的父母有班级someClass

_.pluck($('.someClass').find('a'), 'text');

Working fiddle

【参考方案4】：

使用 ES6 arrow functions 的单行代码，使用 jQuery .map()：

const ids = $('a.someClass').map((i, el) => el.getAttribute('href')).get();

console.log(ids);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="test1" class="someClass">t1</a>
<a href="test2" class="someClass">t2</a>
<a href="test3" class="someClass">t3</a>