jQuery - 从类的元素中获取属性值的列表答案

【问题标题】：jQuery - get a list of values of an attribute from elements of a classjQuery - 从类的元素中获取属性值的列表
【发布时间】：2011-02-14 18:58:35
【问题描述】：

我有一个类.object，它有一个名为level 的属性。我想在页面上获取level 的所有不同值的列表，以便我可以选择最高的值。

如果我这样做：

$(".object").attr("level")

... 这会给我一个作为级别属性值的值列表吗？我怀疑不是，但是你怎么做这样的事情？

注意：我不想像更常见的那样选择要操作的 HTML 对象，而是想选择属性的值。

编辑：为了获得最高的“级别”，我这样做了，但它似乎不起作用。我现在将尝试其他建议的方法。

var highLevel=0;
$.each(".object[level]", function(i, value) {
   if (value>highLevel) {
       highLevel=value;
   }
});

alert(highLevel);

【问题讨论】：

@Ankur 你应该选择其中之一作为这个问题的答案

标签： jquery css-selectors

【解决方案1】：

$(".object").attr("level") 只会返回第一个 .object 元素的属性。

这将为您提供所有levels 的数组：

var list = $(".object").map(function(){return $(this).attr("level");}).get();

【讨论】：

.get() 有什么作用？
@Yuji - get 将 jQuery 对象转换为常规数组。
@MandeepJain：如何将答案标记为“正确”？这个可能没有被标记为“接受”，但超过 100 人投票认为它“有用”，这对我来说已经足够了！
很好的答案。对我来说更直观/更简洁的是先.get() 数组，然后使用.map() 加上箭头函数（浏览器支持：caniuse.com/#search=arrow）用一点普通的javascript构建数组：$(".object").get().map(x => x.getAttribute('level'));

【解决方案2】：

问题的第一部分，将属性值放入数组中。看到这个问题

jQuery get img source attributes from list and push into array

你会说

var levelArray = $('.object').map( function() {
    return $(this).attr('level');
}).get();

问题的第二部分，可以使用this technique to get the highest value

var maxValue = Math.max.apply( Math, levelArray );

【讨论】：

【解决方案3】：

<script type="text/javascript"> 
var max = 0;
jQuery(document).ready(function(){ 
    jQuery('.object[level]').each(function(){
        var num = parseInt($(this).attr('level'), 10);
        if (num > max) { max = num; }
    });
    alert(max);
});
</script>

我假设标记是这样的：

<div class="object" level="1">placeholder</div>
<div class="object" level="10">placeholder</div>
<div class="object" level="20">placeholder</div>
<div class="object" level="1000">placeholder</div>
<div class="object" level="40">placeholder</div>
<div class="object" level="3">placeholder</div>
<div class="object" level="5">placeholder</div>

对于我的代码，我收到“1000”提醒。

这是另一个解决方案，结合了 harpo、lomaxx 和 Kobi 的其他几个回复：

jQuery(document).ready(function(){ 
    var list = $(".object[level]").map(function(){
        return parseInt($(this).attr("level"), 10);
    }).get();
    var max = Math.max.apply( Math, list ); 
    alert(max);
});

【讨论】：

【解决方案4】：

选择器

$(".object[level]")

将为您提供类object 和属性level 的所有dom 元素。

然后你可以只使用 .each() 方法遍历元素以获得最高值

【讨论】：

$(".object[level=something]") where something 是您要查找的属性值

【解决方案5】：

您可以extend the functionality of Jquery 并添加您自己的“attrs”实现。

将以下代码行添加到您的 JavaScript 文件中：

jQuery.fn.extend({
    attrs: function (attributeName) {
        var results = [];
        $.each(this, function (i, item) {
            results.push(item.getAttribute(attributeName));
        });
        return results;
    }
});

现在您可以通过调用获取级别值列表：

$(".object").attrs("level")

【讨论】：