質問編集履歴

1

追記

2020/01/18 17:13

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -16,56 +16,262 @@
16
16
 
17
17
 
18
18
 
19
- if (hour > 24) {
20
-
21
- hour -= 24;
22
-
23
- day += 1;
24
-
25
- if (
26
-
27
- (day > 31 && month == 1, 3, 5, 7, 8, 10, 12) ||
28
-
29
- ((day == 30 && month == 4), 6, 9, 11) ||
30
-
31
- (day > 28 && month == 2) ||
32
-
33
- (day > 29 && month == 2 && year % 4 == 0)
34
-
35
- ) {
36
-
37
- day -= 12;
38
-
39
- month += 1;
40
-
41
- console.log(
42
-
43
- String(year) +
44
-
45
- "年" +
46
-
47
- String(month) +
48
-
49
- "月" +
50
-
51
- String(day) +
52
-
53
- "" +
54
-
55
- String(hour) +
56
-
57
- "時"
58
-
59
- );
60
-
61
- if (month > 12) {
62
-
63
- year += 1;
64
-
65
- }
66
-
67
- }
68
-
69
- }
19
+ <!DOCTYPE html>
20
+
21
+ <html lang="ja">
22
+
23
+ <meta charset="utf-8" />
24
+
25
+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
26
+
27
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
28
+
29
+ <head>
30
+
31
+ <title>最終課題</title>
32
+
33
+ <link
34
+
35
+ href="./bootstrap-4.4.1-dist/css/bootstrap.min.css"
36
+
37
+ rel="stylesheet"
38
+
39
+ />
40
+
41
+ <script src="./jquery-3.4.1.min.js"></script>
42
+
43
+ <script src="./bootstrap-4.4.1-dist/js/bootstrap.min.js"></script>
44
+
45
+ <script>
46
+
47
+ $(function() {
48
+
49
+ const url =
50
+
51
+ "http://api.openweathermap.org/data/2.5/forecast?id=1849814&APPID=";
52
+
53
+ const key = "a362e731b66c5036016466ff86f756e4";
54
+
55
+
56
+
57
+ var position;
58
+
59
+ $.getJSON(url + key, function(json) {
60
+
61
+ $("#place").append("<h2>" + json.city.name + "</h3>");
62
+
63
+ for (var i = 0; i < json.list.length; i++) {
64
+
65
+ var tenki = "";
66
+
67
+ var date = json.list[i].dt_txt;
68
+
69
+
70
+
71
+ var year = Number(date.substr(0, 4));
72
+
73
+ // console.log(date);
74
+
75
+ // console.log(year);
76
+
77
+ var month = Number(date.substr(5, 2));
78
+
79
+ // console.log(month);
80
+
81
+ var day = Number(date.substr(8, 2));
82
+
83
+ // console.log(day);
84
+
85
+ var hour = Number(date.substr(11, 2));
86
+
87
+ // console.log(hour);
88
+
89
+ // 2020-01-18 21:00:00
90
+
91
+
92
+
93
+ hour += 9;
94
+
95
+
96
+
97
+ if (hour > 24) {
98
+
99
+ hour -= 24;
100
+
101
+ day += 1;
102
+
103
+ if (
104
+
105
+ (day > 31 && month == 1, 3, 5, 7, 8, 10, 12) ||
106
+
107
+ (day == 30 && month == 4, 6, 9, 11) ||
108
+
109
+ (day > 28 && month == 2) ||
110
+
111
+ (day > 29 && month == 2 && year % 4 == 0)
112
+
113
+ ) {
114
+
115
+ day -= 12;
116
+
117
+ month += 1;
118
+
119
+ console.log(
120
+
121
+ String(year) +
122
+
123
+ "年" +
124
+
125
+ String(month) +
126
+
127
+ "月" +
128
+
129
+ String(day) +
130
+
131
+ "日" +
132
+
133
+ String(hour) +
134
+
135
+ "時"
136
+
137
+ );
138
+
139
+ if (month > 12) {
140
+
141
+ year += 1;
142
+
143
+ }
144
+
145
+ }
146
+
147
+ }
148
+
149
+
150
+
151
+ date =
152
+
153
+ String(year) +
154
+
155
+ "年" +
156
+
157
+ String(month) +
158
+
159
+ "月" +
160
+
161
+ String(day) +
162
+
163
+ "日" +
164
+
165
+ String(hour) +
166
+
167
+ "時";
168
+
169
+
170
+
171
+ if (json.list[i].weather[0].main == "Clear") {
172
+
173
+ tenki = "はれ";
174
+
175
+ } else if (json.list[i].weather[0].main == "Clouds") {
176
+
177
+ tenki = "くもり";
178
+
179
+ } else if (json.list[i].weather[0].main == "Rain") {
180
+
181
+ tenki = "あめ";
182
+
183
+ }
184
+
185
+
186
+
187
+ $(".container").append(
188
+
189
+ $(".table").append(
190
+
191
+ $(".tbody").append(
192
+
193
+ $('<tr id="data' + i + '"></tr>').append([
194
+
195
+ $("<td></td>").text(date),
196
+
197
+ $("<td></td>").html(
198
+
199
+ ' <img src="' +
200
+
201
+ "http://openweathermap.org/img/w/" +
202
+
203
+ json.list[i].weather[0].icon +
204
+
205
+ '.png"> '
206
+
207
+ ),
208
+
209
+ $("<td></td>").text(tenki)
210
+
211
+ ])
212
+
213
+ )
214
+
215
+ )
216
+
217
+ );
218
+
219
+ }
220
+
221
+ });
222
+
223
+ });
224
+
225
+ </script>
226
+
227
+ </head>
228
+
229
+
230
+
231
+ <body>
232
+
233
+ <h1>天気予報</h1>
234
+
235
+ <div>
236
+
237
+ <p id="place"></p>
238
+
239
+ </div>
240
+
241
+
242
+
243
+ <div class="container">
244
+
245
+ <table class="table">
246
+
247
+ <thead>
248
+
249
+ <tr>
250
+
251
+ <th>date</th>
252
+
253
+ <th>icon</th>
254
+
255
+ <th>weather</th>
256
+
257
+ </tr>
258
+
259
+ </thead>
260
+
261
+ <tbody class="tbody">
262
+
263
+ <div class="data"></div>
264
+
265
+ </tbody>
266
+
267
+ </table>
268
+
269
+ </div>
270
+
271
+ </body>
272
+
273
+ </html>
274
+
275
+
70
276
 
71
277
  ```