jQuery从数组中设置元素li数据

jQuery set element li data from array

本文关键字：元素 li 数据 设置 数组 jQuery      更新时间：2023-09-26

如果我有一个列表：

<div class="item active ui-sortable">
  <li class="player ui-droppable" data-name="Kev" data-pick-id="534dd2424b65762a89020000">
    Teddy Bridgewater
    <div class="pull-right" id="player-badges">
      <span id="points-holder">
        10
      </span>
      <span class="remove-player player-badge">
        <i class="fa fa-trash-o"></i>
      </span>
    </div>
  </li>
  <li class="player pick-blank ui-droppable" data-name="" data-pick-id="534dd2424b65762a89030000">
    EMPTY
    <div class="pull-right" id="player-badges">
      <span id="points-holder">
        7
      </span>
    </div>
  </li>
  <li class="player ui-droppable" data-name="kevin" data-pick-id="534dd2424b65762a89040000">
    kevin
    <div class="pull-right" id="player-badges">
      <span id="points-holder">
        5
      </span>
      <span class="remove-player player-badge">
        <i class="fa fa-trash-o"></i>
      </span>
    </div>
  </li>
</div>

我正在制作一个data-pick-id的数组，然后我如何基于数组["534dd2424b65762a89020000", "534dd2424b65762a89030000", "534dd2424b65762a89040000"]重写这个列表？

上下文：我使用的是jquery sortable，希望只保留data-pick-id的dom结构。这样，我可以更改所有内容并更新到服务器，同时保留ID的实际dom位置。

同样，我想做的就是循环遍历并将该数组写入每个data-pick-id。循环是最好的选择吗？

一个简单的.each()就足够了：

var ids = [1, 2, 3];
$('.player').each(function(i) {
    $(this).data('pick-id', ids[i]);
});

您可能希望使选择器更加明确

相关文章：