jQuery - รับรายการค่าของแอตทริบิวต์จากองค์ประกอบของคลาส

ฉันได้เรียนที่มีแอตทริบิวต์ที่เรียกว่า.object levelฉันต้องการรับรายการของค่าที่แตกต่างกันทั้งหมดlevelในเพจเพื่อที่ฉันจะได้เลือกค่าสูงสุด

หากฉันทำสิ่งที่ชอบ:

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

... นั่นจะทำให้ฉันได้รับรายการค่าที่เป็นค่าของแอตทริบิวต์ระดับหรือไม่? ฉันไม่สงสัย แต่แล้วคุณจะทำอะไรแบบนั้นได้อย่างไร?

หมายเหตุ:ฉันไม่ต้องการเลือกออบเจ็กต์ HTML สำหรับการจัดการเหมือนทั่วไป แต่ฉันต้องการเลือกค่าของแอตทริบิวต์

แก้ไข: เพื่อให้ได้ "ระดับ" สูงสุดฉันได้ทำสิ่งนี้แล้ว แต่ดูเหมือนจะไม่ได้ผล ฉันจะลองวิธีอื่นที่แนะนำตอนนี้

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

alert(highLevel);

$(".object").attr("level")จะส่งคืนแอตทริบิวต์ของ.objectองค์ประกอบแรก

สิ่งนี้จะทำให้คุณได้รับอาร์เรย์ทั้งหมดlevel:

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

ส่วนแรกของคำถามรับค่าแอตทริบิวต์ในอาร์เรย์ ดูคำถามนี้

jQuery รับแอตทริบิวต์แหล่งที่มา img จากรายการและผลักดันเข้าสู่อาร์เรย์

คุณจะบอกว่า

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

ส่วนที่สองของคำถามคุณสามารถใช้เทคนิคนี้เพื่อให้ได้มูลค่าสูงสุด

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>

ฉันสมมติว่ามาร์กอัปเป็นดังนี้:

<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);
});

ตัวเลือก

$(".object[level]")

จะทำให้คุณทุกองค์ประกอบ Dom กับการเรียนและแอตทริบิวต์objectlevel

จากนั้นคุณสามารถใช้เมธอด. each () เพื่อวนซ้ำองค์ประกอบเพื่อให้ได้ค่าสูงสุด

คุณสามารถขยายการทำงานของ 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")