I valori più alti e più bassi di un determinato attributo in jQuery o Javascript

Question

ho le seguenti div:

<div id="2" class="maindiv">test</div> 
<div id="5" class="maindiv">test</div> 
<div id="3" class="maindiv">test</div> 
<div id="1" class="maindiv">test</div> 
<div class="maindiv">test</div>  
<div id="4" class="maindiv">test</div>  

Come ottenere il più alto id (5) e l'ID più basso (1) in jQuery o Javascript ?

Answer 1

function minMaxId(selector) { 
    var min=null, max=null; 
    $(selector).each(function() { 
    var id = parseInt(this.id, 10); 
    if ((min===null) || (id < min)) { min = id; } 
    if ((max===null) || (id > max)) { max = id; } 
    }); 
    return {min:min, max:max}; 
} 

minMaxId('div'); // => {min:1, max:5} 

http://jsfiddle.net/qQvVQ/

Answer 2

Creare una variabile globale e confrontarla con ciascun elemento utilizzando Math.max all'interno di un ciclo.

var maxval = Number.MIN_VALUE, 
    minval = Number.MAX_VALUE; 

$('div').each(function() { 
    var num = parseInt(this.id, 10) || 0; // always use a radix 
    maxval = Math.max(num, maxval); 
    minval = Math.min(num, minval); 
}); 

console.log('max=' + maxval); 
console.log('min=' + minval); 

http://jsfiddle.net/mblase75/gCADe/

Answer 3

var min = Number.MAX_VALUE, max = Number.MIN_VALUE; 
$(".maindiv").each(function() { 
    var id = parseInt(this.id, 10); 
    if (id > max) { 
     max = id; 
    } 
    if (id < min) { 
     min = id; 
    } 
}); 

Answer 4

In primo luogo è necessario creare un array contenente tutti i valori id, quindi utilizzare Math per ottenere la più alta/bassa:

var ids = $(".maindiv[id]").map(function() { 
    return parseInt(this.id, 10); 
}).get(); 

var highest = Math.max.apply(Math, ids); 
var lowest = Math.min.apply(Math, ids); 

Example fiddle

Nota loÈ richiesto il selettore di attributo, altrimenti viene assunto 0 per il valore mancante.

Answer 5

È necessario utilizzare i dati anziché l'id per questo.

<div data-value="2" class="maindiv">test</div> 
<div data-value="5" class="maindiv">test</div> 
<div data-value="3" class="maindiv">test</div> 
etc. 

Modifica: ho accorciato la mia risposta in favore della risposta accettata di Rory McCrossan sopra riportata.

Answer 6

var valArray = []; 
$('.maindiv').each(function(){ 
    valArray.push(parseInt($(this).attr('id'), 10)); 
}) 
valArray.sort(function(a, b) { return a - b }) 

valArrayp[0] // lowest 
valArrayp[valArrayp.length - 1] // highest` 

non ho ancora testato, dovrebbe funzionare anche se

Answer 7

È possibile utilizzare la funzione di ordinamento per farlo.

function arrayify(obj){ 
    return [].slice.call(null,obj); 
} 
var all = arrayify(document.querySelectorAll('div[id]')); 
var max = all.sort().pop(); 
var min = all.sort().reverse().pop(); 

Questo è il modo più semplice che usare jQuery