Question

给出具有data属性的n个html元素：

<div class="tpl" data-points="2"></div>
<div class="tpl" data-points="5"></div>
<div class="tpl" data-points="10"></div>
<div class="tpl" data-points="5"></div>

如何将这些数据点的值转换为单个数组？，因此最终结果如下：

var historic = [ "2", "5", "10", "5"];

编辑：我最终使用了：

$('.tpl').each(
  function (i) { 
       historic[i] = $(this).attr('data-points'); 
  }
);

Answer 1

使用.map方法与.get一起检索实际的普通值数组：

var historic = $('.tpl').map(function() {
    return $(this).data('points');
}).get();

DEMO： http://jsfiddle.net/yuvPH/2/

Answer 2

您可以使用.map()：

var data = $('div.tpl').map(function() {
  return $(this).data('points');
}).get();

Here's a fiddle

Answer 3

使用此

$(document).ready(function(){
   $('.tpl').each(function(index){
        var data = $(this).attr('data-points');
        historic[index] = data;
        alert(data);
    });

});

工作JSFiddle

Answer 4

var historic=[ "0", "0", "0", "0"];
console.log("Initial: "+ JSON.stringify(historic));

i=0;
$(".tpl").each(function(){
   historic[i++]=$(this).attr('data-points');        
});

console.log("Final: "+ JSON.stringify(historic));

Answer 5

你可以试试这个，而不是.attr()使用jQuery的.data()方法：

var historic = []; // array declaration

$('.tpl').each(function() { // iteration
    historic.push($(this).data('points')); // storing values in array
});

console.log(historic);

Answer 6

您可以使用此

var historic=[];
console.log("Initial: "+ JSON.stringify(historic));

$.each($('.tpl'), function(){
    historic.push($(this).data('points'));
});

console.log("Final: "+ JSON.stringify(historic));

小提琴链接：http://jsfiddle.net/yuvPH/6/

如何获取元素列表的数据属性？

6 个答案:

Here's a fiddle