-
Notifications
You must be signed in to change notification settings - Fork 63
/
Copy pathindex.html
129 lines (104 loc) · 3.11 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title> </title>
<style>
body {
color: #000000;
background-color: #ffffff;
}
ul {
list-style: none;
line-height: 32px;
}
.page {
/*position: fixed;*/
width: 100%;
height: 100%;
}
.time_container,
.date_container {
width: 100%;
margin: auto;
text-align: center;
}
.time_container {
top: 0;
height: 40%;
}
.date_container {
}
.time {
margin: 120px 50px 120px 50px;
font-size: 8rem;
}
.date {
padding-top: 40px;
font-size: 4rem;
}
#weaTitle {
font-size: 1rem;
}
#weaList {
font-size: 1rem;
}
</style>
</head>
<body>
<div class="page">
<div class="time_container">
<div class="time" id="time">00:00</div>
</div>
<div class="date_container">
<div class="date" id="date">1月1日</div>
</div>
<div class="weather_container">
<p id="weaTitle">当前天气</p>
<ul id="weaList"></ul>
</div>
</div>
<script>
function update() {
function createXHR(){
var xhr = null;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
}else if(window.ActiveXObject){
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
return xhr;
}
function getWea(){
var xhr = createXHR();
xhr.open('GET','https://tianqiapi.com/free/day?appid=48353766&appsecret=VjZ4oxd5',true);
xhr.onreadystatechange = function(){
if(this.readyState == 4){
var data = JSON.parse(this.responseText)
var info = '<li>天气：'+data.wea+'</li>'+
'<li>当前气温：'+data.tem+'℃</li>'+
'<li>最高气温：'+data.tem_day+'℃</li>'+
'<li>最低气温：'+data.tem_night+'℃</li>'+
'<li>更新时间：'+data.update_time+'</li>';
document.getElementById('weaList').innerHTML = info
document.getElementById('weaTitle').innerHTML = data.city + '当前天气'
}
}
xhr.send(null);
}
getWea()
var date = new Date()
var utc8DiffMinutes = date.getTimezoneOffset() + 480
date.setMinutes(date.getMinutes() + utc8DiffMinutes)
var timeString = date.getHours() + ':' + ('0' + date.getMinutes()).slice(-2)
var dateString = (date.getMonth() + 1) + '月' + date.getDate() + '日'
var weekList = ['日', '一', '二', '三', '四', '五', '六']
var weekString = '星期' + weekList[date.getDay()]
document.getElementById("time").innerHTML = timeString
document.getElementById("date").innerHTML = dateString + " " + weekString
}
update()
setInterval("update()", 60 * 1000)
</script>
</body>
</html>