Pregunta jQuery: obtén una lista de valores de un atributo de elementos de una clase


Tengo una clase .object que tiene un atributo llamado level. Quiero obtener una lista de todos los diferentes valores de level en la página para que pueda seleccionar el más alto.

Si hago algo como:

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

... ¿me proporcionará una lista de valores que son los valores del atributo de nivel? Sospecho que no, pero ¿cómo haces algo así?

Nota: No quiero seleccionar un objeto HTML para la manipulación, como es más común, prefiero seleccionar los valores del atributo.

EDITAR: Para obtener el "nivel" más alto, lo he hecho, pero parece que no funciona. Voy a probar el otro método sugerido ahora.

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

alert(highLevel);

73
2018-05-02 15:58


origen


Respuestas:


$(".object").attr("level") simplemente devolverá el atributo de primero el primero .object elemento.

Esto te dará una variedad de todos levels:

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

168
2018-05-02 16:02



Primera parte de la pregunta, obteniendo los valores de los atributos en una matriz. Ver esta pregunta

jQuery obtiene atributos de origen img de list y push in array

Tu dirías

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

Segunda parte de la pregunta, puedes usar esta técnica para obtener el mayor valor

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

25
2018-05-02 16:20



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

Asumo un marcado como este:

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

Para mi código me avisan "1000".

Aquí hay otra solución, combinando varias de las otras respuestas de harpo, lomaxx y 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);
});

3
2018-05-02 16:35



el selector

$(".object[level]")

te dará todos los elementos dom con clase object y un atributo level.

Entonces puedes usar el método .each () para iterar sobre los elementos para obtener el valor más alto


2
2018-05-02 16:02



Usted puede extender la funcionalidad de Jquery y agrega tu propia implementación 'attrs'.

Agregue las siguientes líneas de código a su archivo JavaScript:

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

Ahora puede obtener la lista de valores de nivel llamando:

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

0
2018-05-24 13:25