用jq将html元素根据属性中的数据分组

在编程过程中，有时候会对页面遍历出来的元素根据某个参数进行分组排序，下面展示如何分组：

比如遍历出来的元素如下：

<div id="col">

  <div flag="1">1</div>

  <div flag="3">3</div>

  <div flag="3">3</div>

  <div flag="2">2</div>

  <div flag="1">1</div>

  <div flag="3">3</div>

</div>

<div id="test"></div>

想要根据flag中的数字，按照1，1，2，3，3，3分组显示，结果为

  <div flag="1">1</div>

  <div flag="1">1</div>

  <div flag="2">2</div>

  <div flag="3">3</div>

  <div flag="3">3</div>

  <div flag="3">3</div>

可以做如下处理

jq：

var div = $("[flag]");//获取所有属性中有flag的元素

var table = {};

var len = div.length;

for (var i = 0; i < len; i++) {

  if (table[$(div[i]).attr("flag")] == undefined) {

    var list = [];

    list.push(div[i]);

    table[$(div[i]).attr("flag")] = list;

  } else {

    table[$(div[i]).attr("flag")].push(div[i]);//将需要的元素添加进table

  }

}

for(param in table){

  $("#test").append($(table[param]).clone());//拼接到需要的元素上

}

注意：如果append的时候不用clone方法的话，会将原来的记录覆盖