订单清单项目的数据值

Question

如何通过数据评估器或替代方法设置li项目的排序？

<ul>
  <li id="two" data-value="3"> 1 </li>
  <li id="three" data-value="1"> 2 </li>
  <li id="one" data-value="2"> 3 </li>
</ul>

//输出必须为3 1 2，但我有100多个项目

Answer 1

对li的数据值使用排序逻辑，并更新ul html。

$("#test").html(
  $("#test").children("li").sort(function (a, b) {
    var val1= parseInt($(a).data('value'));
    var val2= parseInt($(b).data('value'));
      return val1-val2;
  })
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="test">
  <li id="two" data-value="3"> 1 </li>
  <li id="three" data-value="1"> 2 </li>
  <li id="one" data-value="2"> 3 </li>
</ul>