最近课题要结项，自由支配的时间越发宝贵了

任务目的

在上一任务基础上继续JavaScript的体验
接触一下JavaScript中的高级选择器
学习JavaScript中的数组对象遍历、读写、排序等操作
学习简单的字符串处理操作

任务描述

参考以下示例代码，读取页面上已有的source列表，从中提取出城市以及对应的空气质量
将数据按照某种顺序排序后，在resort列表中按照顺序显示出来

任务最终代码

<script type="text/javascript">
    var $ = function(id){
      return document.getElementById(id);
    }
    /**
     + getData方法
     + 读取id为source的列表，获取其中城市名字及城市对应的空气质量
     + 返回一个数组，格式见函数中示例
     */
    function getData() {
      /*
      coding here
      */
      /*
      data = [
        ["北京", 90],
        ["北京", 90]
        ……
      ]
      */
      var data = [];
      var li = $('source').getElementsByTagName('li');
      for(var i=0; i<li.length; i++){
        var city = li[i].innerHTML.split("空气质量：")[0];

        var num = li[i].getElementsByTagName('b')[0].innerHTML;
        //var num = Number(li.children[0].innerHTML);

        data[data.length] = [city,num];
        //data.push([city,num]);
      }
      console.log(data.length);
      return data;
    }
    /**
     + sortAqiData
     + 按空气质量对data进行从小到大的排序
     + 返回一个排序后的数组
     */
    function sortAqiData(data) {
      data.sort(function(a,b){
        return a[1] - b[1];
      });
      return data;
    }
    /**
     + render
     + 将排好序的城市及空气质量指数，输出显示到id位resort的列表中
     + 格式见ul中的注释的部分
     */
    function render(data) {
      var chineseNum = ["零", "一", "二", "三", "四", "五", "六", "七", "八", "九"];
      for(var i=0; i<data.length; i++){
        $("resort").innerHTML += "<li>第" + chineseNum[i+1] +　"名：" + data[i][0] + "空气质量：<b>" + data[i][1] + "</b></li>";
      }
    }
    function btnHandle() {
      var aqiData = getData();
      aqiData = sortAqiData(aqiData);
      render(aqiData);
    }
    function init() {
      // 在这下面给sort-btn绑定一个点击事件，点击时触发btnHandle函数
      $("sort-btn").addEventListener("click",btnHandle,false);
    }
    init();
</script>