jQuery: ottieni un elenco di valori di un attributo dagli elementi di una classe

Ho una classe .objectche ha un attributo chiamato level. Voglio ottenere un elenco di tutti i diversi valori di levelsulla pagina in modo da poter selezionare quello più alto.

Se faccio qualcosa come:

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

... questo mi farà ottenere un elenco di valori che sono i valori dell'attributo level? Sospetto di no, ma allora come fai a fare una cosa del genere?

Nota: non voglio selezionare un oggetto HTML per la manipolazione come è più comune, piuttosto voglio selezionare i valori dell'attributo.

EDIT: Per ottenere il più alto "livello" ho fatto questo, ma non sembra funzionare. Adesso proverò l'altro metodo suggerito.

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

alert(highLevel);

$(".object").attr("level")restituirà solo l'attributo del primo il primo .objectelemento.

Questo ti darà un array di tutti leveli:

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

Prima parte della domanda, ottenere i valori degli attributi in un array. Vedi questa domanda

jQuery ottiene gli attributi di origine img dall'elenco e li inserisce nell'array

Tu diresti

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

Seconda parte della domanda, puoi usare questa tecnica per ottenere il massimo valore

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

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

Suppongo che un markup come questo:

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

Per il mio codice ricevo un avviso "1000".

Ecco un'altra soluzione, combinando molte delle altre risposte di harpo, lomaxx e 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);
});

il selettore

$(".object[level]")

ti darà tutti gli elementi dom con class objecte un attributo level.

Quindi puoi semplicemente usare il metodo .each () per iterare sugli elementi per ottenere il valore più alto

È possibile estendere le funzionalità di Jquery e aggiungere la propria implementazione "attrs".

Aggiungi le seguenti righe di codice al tuo file JavaScript:

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

Ora puoi ottenere l'elenco dei valori di livello chiamando:

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