例子:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<style type="text/css">
* {
  margin: 0;
  padding: 0;
}
body {
  padding: 100px;
}
.select {
  position: relative;
  display: inline-block;
  width: 200px;
  height: 30px;
  outline: none;
  background: #f5fafe;
  color: #555555;
  font-size: 18px;
  line-height: 30px;
  border: 1px solid #cad9ea;
  text-indent: 15px;
}
.select option {
  text-indent: 15px;
}
.select option:hover {
  background-color: #ff8800;
  color: #fff;
}
table {
  width: 100%;
  font-size: 16px;
  table-layout: fixed;
  empty-cells: show;
  border-collapse: collapse;
  margin: 20px auto;
  border: 1px solid #cad9ea;
  color: #666;
}
th {
  background: linear-gradient(#f3faff, #f5fafe);
  height: 40px;
  overflow: hidden;
}
td {
  height: 30px;
  text-align: center;
}
td, th {
  border: 1px solid #cad9ea;
  padding: 0 1em 0;
}
tr:nth-child(odd) {
  background-color: #f5fafe;
}
</style>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script type="text/template" id="dataItem">
<tr>
  <td>name</td>
  <td>age</td>
  <td>sex</td>
  <td>weight(kg)</td>
  <td>school</td>
  <td>looking</td>
  <td>job</td>
</tr>
</script>
<script>
(function () {
  var sortBy = function (list, attrName, order) {
      console.log(attrName)
      console.log(order)
    return list
     .slice()
     .sort(function (left, right) {
       var a = left[attrName];
       var b = right[attrName];
       if (a > b || a === void 0) return 1 * order;
       if (a < b || b === void 0) return -1 * order;
       return -1 * order;
     });
  };
  var template = function (string, user) {
    return string.replace('name', user.name)
      .replace('age', user.age)
      .replace('sex', user.sex)
      .replace('weight', user.weight)
      .replace('school', user.school)
      .replace('looking', user.looking)
      .replace('job', user.job);
  };
  
  var getSortedString = function (string, data, select) {
    var str = '';
    var order = parseInt($('#order').val(), 10);
    if (select !== '-1') {
      data = sortBy(data, select, order);
    }
    data.forEach(function (user) {
      str += template(string, user);
    });
    return str;
  };
  window.getSortedString = getSortedString;
})();
  
$(function () {
  var list = [{
    name: 'div教程',
    age: 25,
    sex: '男',
    weight: 60,
    school: '蚂蚁部落',
    looking: '标准',
    job: '前端工程师'
  }, {
    name: 'css教程',
    age: 24,
    sex: '女',
    weight: 56,
    school: '蚂蚁部落',
    looking: '上等',
    job: '后台'
  }, {
    name: 'ajax教程',
    age: 27,
    sex: '男',
    weight: 80,
    school: '',
    looking: '中下',
    job: '前端工程师'
  }, {
    name: 'js教程',
    age: 22,
    sex: '女',
    weight: 54,
    school: '青岛科技大学',
    looking: '美丽',
    job: '前端工程师'
  }, {
    name: 'softwhy.com',
    age: 20,
    sex: '男',
    weight: 70,
    school: '青岛大学',
    looking: '中等',
    job: '后台开发'
  }, {
    name: 'css3教程',
    age: 19,
    sex: '女',
    weight: 55,
    school: '清华',
    looking: '上等',
    job: '美工'
  }, {
    name: 'json教程',
    age: 28,
    sex: '女',
    weight: 65,
    school: '海洋大学',
    looking: '漂亮',
    job: '美工'
  }];
  
  var fillData = function (select) {
    var str = getSortedString(string, list, select);
    console.log(str)
    $('#table tr').not('.head').remove();
    $('#table').append(str);
  };
  
  var string = $('#dataItem').html();
  console.log(string)
  $('#select').change(function () {
    var select = $(this).val();
    console.log(select)
    fillData(select);
  });
  
  $("#order").change(function () {
    $("#select").trigger("change");
  });
  fillData('-1');
});
</script>
</head>
<body>
  <select class="select" id="select">
    <option value="-1">请选择排序方式</option>
    <option value="name">姓名</option>
    <option value="age">年龄</option>
    <option value="sex">性别</option>
    <option value="weight">体重</option>
    <option value="school">学校</option>
    <option value="looking">相貌</option>
    <option value="job">职业</option>
  </select>
  <select class="select" id="order">
    <option value="1">升序</option>
    <option value="-1">降序</option>
  </select>
  <table summary="人员信息表" id="table">
    <tr class="head">
      <th>姓名</th>
      <th>年龄</th>
      <th>性别</th>
      <th>体重</th>
      <th>学校</th>
      <th>相貌</th>
      <th>职业</th>
    </tr>
  </table>
</body>
</html>

关键代码

/**
 * 
 * @param {ArrObj} list  当前的数组对象
 * @param {string} attrName  需要排序的name 表格字段的key
 * @param {int} order 升序还是降序  升序为1 降序为-1
 */
function tableSort(list,attrName,order){
  return list
   .slice()
   .sort(function (left, right) {
     var a = left[attrName];
     var b = right[attrName];
     if (a > b || a === void 0) return 1 * order;
     if (a < b || b === void 0) return -1 * order;
     return -1 * order;
   });
}