giá trị thuộc tính duy nhất với jquery

Question

là có cách để có được tất cả các giá trị duy nhất cho một thuộc tính nhất định.

ví dụ

<div class="bob" data-xyz="fish"></div> 
<div class="bob" data-xyz="dog"></div> 
<div class="bob" data-xyz="fish"></div> 
<div class="bob" data-xyz="cat"></div> 
<div class="bob" data-xyz="fish"></div> 

tôi cần để có được tất cả các giá trị khác biệt cho thuộc tính dữ liệu xyz trên div.bob,

vì vậy nó nên trở cá, chó và mèo.

Answer 1

mã nhỏ: Tạo một đối tượng và làm cho 'chó' 'cá' 'mèo' properties. Điều đó sẽ làm cho chúng độc đáo. Sau đó lấy tên thuộc tính duy nhất từ ​​đối tượng. Đơn giản và dễ dàng:

var items = {}; 
$('div.bob').each(function() { 
    items[$(this).attr('data-xyz')] = true; 
}); 

var result = new Array(); 
for(var i in items) 
{ 
    result.push(i); 
} 
alert(result); 

http://jsfiddle.net/GxxLj/1/

Answer 2

var array = $('div.bob').map(function() { return $(this).data('xyz'); }); 

Điều đó sẽ trả về tất cả các giá trị. Sau đó, bạn có thể chạy nó thông qua một chức năng duy nhất.

How do I make an array with unique elements (i.e. remove duplicates)?

function ArrNoDupe(a) { 
    var temp = {}; 
    for (var i = 0; i < a.length; i++) 
     temp[a[i]] = true; 
    var r = []; 
    for (var k in temp) 
     r.push(k); 
    return r; 
} 
array = ArrNoDupe(array); 

Answer 3

Theo dõi các giá trị mà bạn đã xử lý:

var seen = {}; 

var values = $('div.bob').map(function() { 
    var value = this.getAttribute('data-xyz'); 
    // or $(this).attr('data-xyz'); 
    // or $(this).data('xyz'); 

    if(seen.hasOwnProperty(value)) return null; 

    seen[value] = true; 
    return value; 
}).get(); 

tham khảo:$.map()

này, tất nhiên, chỉ làm việc với các giá trị nguyên thủy. Trong trường hợp bạn đang ánh xạ tới đối tượng, bạn phải ghi đè phương thức toString() của các đối tượng để chúng có thể được sử dụng làm khóa.

Hoặc như plugin:

(function($) { 

    $.fn.map_unique = function(callback) { 
     var seen = {}; 
     function cb() { 
      var value = callback.apply(this, arguments); 
      if(value === null || seen.hasOwnProperty(value)) { 
       return null; 
      } 
      seen[value] = true; 
      return value; 
     } 
     return this.map(cb); 
    }); 

}(jQuery));