1. 程式人生 > >JS——天氣預報表格

JS——天氣預報表格

模糊 body ole notice width gpo idt sunshine head

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table border="1"cellpadding="5" width="100%">
<tr><th>日期</th><th>日出</th><th>高溫</th><th>低溫</th><th>日落</th><th>空氣質量</th><th>風向</th><th>風力</th><th>類型</th><th>小提示</th></tr>
<script type="text/javascript">

var air=[{
"date":"18日星期一",
"sunrise":"07:47",
"high":"高溫 8.0℃",
"low":"低溫 5.0℃",
"sunset":"18:23",
"aqi":65.0,
"fx":"無持續風向",
"fl":"<3級",
"type":"陰",
"notice":"灰蒙蒙的天空就像模糊了的眼睛"
},
{
"date":"19日星期二",
"sunrise":"07:47",
"high":"高溫 9.0℃",
"low":"低溫 2.0℃",
"sunset":"18:23",
"aqi":69.0,
"fx":"無持續風向",
"fl":"<3級",
"type":"多雲",
"notice":"今日多雲,騎上單車去看看世界吧",
},
{
"date":"20日星期三",
"sunrise":"07:48",
"high":"高溫 11.0℃",
"low":"低溫 1.0℃",
"sunset":"18:24",
"aqi":57.0,
"fx":"無持續風向",
"fl":"<3級",
"type":"晴",
"notice":"lovely sunshine,盡情享受陽光的溫暖吧",
},
{
"date":"21日星期四",
"sunrise":"07:49",
"high":"高溫 14.0℃",
"low":"低溫 1.0℃",
"sunset":"18:24",
"aqi":58.0,
"fx":"無持續風向",
"fl":"<3級",
"type":"晴",
"notice":"天氣幹燥,請適當增加室內濕度",
},
{
"date":"22日星期五",
"sunrise":"07:49",
"high":"高溫 14.0℃",
"low":"低溫 3.0℃",
"sunset":"18:25",
"aqi":51.0,
"fx":"無持續風向",
"fl":"<3級",
"type":"晴",
"notice":"晴空萬裏,去沐浴陽光吧",
},
{ "date":"23日星期六",
"sunrise":"07:50",
"high":"高溫 16.0℃",
"low":"低溫 4.0℃",
"sunset":"18:25",
"aqi":56.0,
"fx":"無持續風向",
"fl":"<3級",
"type":"多雲",
"notice":"悠悠的雲裏有淡淡的詩",
}
];
for(var i=0;i<air.length;i++){
document.write("<tr>");
for(var j in air[i]){
document.write("<td>"+air[i][j]+"</td>")
console.log(air[i][j])
}
document.write("</tr>")
}
</script>
</table>
</body>
</html>

JS——天氣預報表格