Question

有几个li元素具有data-id属性，如

<ul>
   <li data-imgid="5" class="getMe">some text</li>
   <li data-imgid="6" class="getMe">some text</li>
   <li data-imgid="7" class="getMe">some text</li>
</ul>

我想循环使用li项并在数组中获取它们，所以我尝试：

var array = [];
$('.getMe').each(function() {
  array.push($(this).data('imgid'));
  console.log($(this).data('imgid'));
})

然而，从日志我可以看到

console.log($(this).data('imgid'));

它返回文本

数据imgid

如何在数组中获取id数据属性？

似乎我在设置数据时犯了一个错误 - imgid我会删除这个问题，

Answer 1

使用attr获取属性。

＆＃13;

var array = [];
$('.getMe').each(function() {
       array.push($(this).attr('data-id'));
       console.log($(this).attr('data-id'));
})

＆＃13;

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
   <li data-id="5" class="getMe">some text</li>
   <li data-id="6" class="getMe">some text</li>
   <li data-id="7" class="getMe">some text</li>
</ul>

＆＃13;

Answer 2

您可以使用.map()方法，然后访问每个元素的dataset属性：

Example Here

var array = $('.getMe').map(function () {
    return this.dataset.imgid;
}).get();

console.log(array);
// ["5", "6", "7"]

当然，您也可以使用.attr()方法获取值：

var array = $('.getMe').map(function () {
    return $(this).attr('data-imgid');
}).get();

或者没有jQuery：

Example Here

var elements = document.querySelectorAll('.getMe'),
    array = Array.prototype.map.call(elements, function (el) {
      return el.dataset.imgid
});

Answer 3

你必须用这个替换你的每一个：

var array = [];
$('.getMe').each(function(index, current) {
       array.push($(current).data('imgid'));
       console.log($(current).data('imgid'));
})

Answer 4

试试这个......

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<ul>
   <li data-imgid="5" class="getMe">some text</li>
   <li data-imgid="6" class="getMe">some text</li>
   <li data-imgid="7" class="getMe">some text</li>
</ul>
<script>
var array = [];
$('.getMe').each(function() {
       array.push($(this).data('imgid'));
       console.log($(this).data('imgid'));
})
console.log($(this).data('imgid'));
console.log(array);
</script>

希望这会有所帮助......

jQuery循环遍历列表项并获取data-imgid属性值

4 个答案: