ARTICLES
js实时获取空气质量PM2.5
2015-07-30 14:56:180字号:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title>test</title>
  5. <script type="text/javascript" src="/statics/js/jquery-1.8.2.min.js"></script>
  6.  
  7. <script type="text/javascript">
  8. var format = function(time, format) {
  9.     var t = new Date(time);
  10.     var tf = function(i) {
  11.         return (< 10 ? '0': '') + i
  12.     };
  13.     return format.replace(/yyyy|MM|dd|HH|mm|ss/g,
  14.     function(a) {
  15.         switch (a) {
  16.         case 'yyyy':
  17.             return tf(t.getFullYear());
  18.             break;
  19.         case 'MM':
  20.             return tf(t.getMonth() + 1);
  21.             break;
  22.         case 'mm':
  23.             return tf(t.getMinutes());
  24.             break;
  25.         case 'dd':
  26.             return tf(t.getDate());
  27.             break;
  28.         case 'HH':
  29.             return tf(t.getHours());
  30.             break;
  31.         case 'ss':
  32.             return tf(t.getSeconds());
  33.             break;
  34.         }
  35.     });
  36. }
  37. //上面函数是转换时间的,json里面格式是2015-06-17T15:00:00Z这样的
  38.  
  39. $.ajax({
  40.     type: "get",
  41.      url:'pm25.php',//这个地方直接写第三方接口地址好像不行,跨域了,经本地文件转了一下,同时呢放php里面避免暴露key
  42.     cache: false,
  43.     dataType : "json",
  44.     success: function(data){
  45.         
  46.         $.each(data, function(commentIndex, comment){
  47.  
  48. var time_point= format(""+comment['time_point']+"", 'yyyy-MM-dd HH:mm:ss');//转换时间
  49.  
  50.             document.getElementById("primary_pollutant").innerHTML=""+comment['primary_pollutant']+"";
  51. document.getElementById("aqi").innerHTML=""+comment['aqi']+"";
  52. document.getElementById("quality").innerHTML=""+comment['quality']+"";
  53. document.getElementById("pm2_5").innerHTML=""+comment['pm2_5']+"";
  54. document.getElementById("time_point").innerHTML=""+time_point+"";
  55.  
  56.       });
  57.                            }
  58.                        });
  59. </script>
  60.    
  61. </head>
  62. <body>
  63. <div>首要污染物:<span id="primary_pollutant"></span></div>
  64. <div>空气质量指数(AQI):<span id="aqi"></span></div>
  65. <div>空气状况:<span id="quality"></span></div>
  66. <div>颗粒物(粒径小于等于2.5μm)1小时平均:<span id="pm2_5"></span></div>
  67. <div>数据更新时间:<span id="time_point"></span></div>
  68. </body>
  69. </html>