• 任务二:零基础JavaScript编码(二)


    任务描述

    参考以下示例代码,页面加载后,将提供的空气质量数据数组,按照某种逻辑(比如空气质量大于60)进行过滤筛选,最后将符合条件的数据按照一定的格式要求显示在网页上

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <title>IFE JavaScript Task 01</title>
      </head>
    <body>
    
      <h3>污染城市列表</h3>
      <ul id="aqi-list">
    <!--   
        <li>第一名:福州(样例),10</li>
          <li>第二名:福州(样例),10</li> -->
      </ul>
    
    <script type="text/javascript">
    
    var aqiData = [
      ["北京", 90],
      ["上海", 50],
      ["福州", 10],
      ["广州", 50],
      ["成都", 90],
      ["西安", 100]
    ];
    
    (function () {
    
      /*
      在注释下方编写代码
      遍历读取aqiData中各个城市的数据
      将空气质量指数大于60的城市显示到aqi-list的列表中
      */
     
      //对二维数组进行排序
      aqiData.sort(function(x,y) {
        return x[1] - y[1];
      });
    
      //空气质量指数排名
      var j=0,chineseRank=['一','二','三','四','五','六','七','八','九','十'];
    
      for(var i=0;i < aqiData.length;i++) {
        if(aqiData[i][1] > 60) {
          // alert(aqiData[i][0]);
          j++;
          var li=document.createElement("li");
          var node=document.createTextNode("第"+chineseRank[j-1]+"名:"+aqiData[i][0]+","+aqiData[i][1]);
          li.appendChild(node);
    
          var element=document.getElementById("aqi-list");
          element.appendChild(li);
        }
      }
    })();
    
    </script>
    </body>
    </html>
    
    
  • 相关阅读:
    [笔记]一道C语言面试题:IPv4字符串转为UInt整数
    linux内核代码注释 赵炯 第三章引导启动程序
    bcd码
    2章 perl标量变量
    1章 perl入门
    perl第三章 列表和数组
    浮动 float
    文字与图像
    3.深入理解盒子模型
    4.盒子的浮动和定位
  • 原文地址:https://www.cnblogs.com/sunmaer/p/6441691.html
Copyright © 2020-2023  润新知