jQuery - lấy danh sách các giá trị của một thuộc tính từ các phần tử của một lớp

Tôi có một lớp .objectcó một thuộc tính được gọi là level. Tôi muốn lấy danh sách tất cả các giá trị khác nhau của leveltrang để có thể chọn giá trị cao nhất.

Nếu tôi làm điều gì đó như:

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

... điều đó sẽ giúp tôi có được một danh sách các giá trị là giá trị của thuộc tính mức độ? Tôi nghi ngờ là không, nhưng sau đó làm thế nào để bạn làm một cái gì đó như vậy?

Lưu ý: Tôi không muốn chọn một đối tượng HTML để thao tác như phổ biến hơn, thay vào đó tôi muốn chọn các giá trị của thuộc tính.

CHỈNH SỬA: Để đạt được "cấp độ" cao nhất, tôi đã làm điều này, nhưng nó có vẻ không hiệu quả. Tôi sẽ thử phương pháp đề xuất khác ngay bây giờ.

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

alert(highLevel);

$(".object").attr("level")sẽ chỉ trả về thuộc tính của .objectphần tử đầu tiên .

Điều này sẽ giúp bạn có được một mảng gồm tất cả các levels:

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

Phần đầu tiên của câu hỏi, nhận các giá trị thuộc tính vào một mảng. Xem câu hỏi này

jQuery lấy các thuộc tính nguồn img từ danh sách và đẩy vào mảng

Bạn sẽ nói

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

Phần thứ hai của câu hỏi, bạn có thể sử dụng kỹ thuật này để nhận được giá trị cao nhất

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>

Tôi giả sử đánh dấu như thế này:

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

Đối với mã của tôi, tôi nhận được thông báo "1000" cho tôi.

Đây là một giải pháp khác, kết hợp một số câu trả lời khác từ harpo, lomaxx và 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);
});

bộ chọn

$(".object[level]")

sẽ cung cấp cho bạn tất cả các phần tử dom với lớp objectvà một thuộc tính level.

Sau đó, bạn chỉ có thể sử dụng phương thức .each () để lặp qua các phần tử để nhận được giá trị cao nhất

Bạn có thể mở rộng chức năng của Jquery và thêm triển khai 'attrs' của riêng bạn.

Thêm các dòng mã sau vào tệp JavaScript của bạn:

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

Bây giờ bạn có thể nhận danh sách các giá trị cấp bằng cách gọi:

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