回答編集履歴

2

変更

2018/06/05 07:48

投稿

yambejp
yambejp

スコア114837

test CHANGED
@@ -177,3 +177,95 @@
177
177
  <div id="view"></div>
178
178
 
179
179
  ```
180
+
181
+ # 日付と曜日を分ける
182
+
183
+
184
+
185
+ ```javascript
186
+
187
+ window.addEventListener('DOMContentLoaded', function(e){
188
+
189
+ var ym=document.querySelector('#ym');
190
+
191
+ var d=new Date();
192
+
193
+ d.setDate(1);
194
+
195
+ setView(d);
196
+
197
+ function setView(d){
198
+
199
+ var m=d.getMonth()+1;
200
+
201
+ ym.textContent=d.getFullYear()+"年"+(d.getMonth()+1)+"月";
202
+
203
+ var youbi=["日","月","火","水","木","金","土"];
204
+
205
+ document.querySelector('#view').textContent="";
206
+
207
+ var table=document.createElement('table');
208
+
209
+ table.setAttribute("border","1");
210
+
211
+ while(d.getMonth()+1==m){
212
+
213
+ var tr=document.createElement('tr');
214
+
215
+ var td=document.createElement('td');
216
+
217
+ td.append(document.createTextNode(m+"/"+d.getDate()));
218
+
219
+ tr.append(td);
220
+
221
+ var td=document.createElement('td');
222
+
223
+ td.append(document.createTextNode(youbi[d.getDay()]));
224
+
225
+ tr.append(td);
226
+
227
+ table.append(tr);
228
+
229
+ d.setDate(d.getDate()+1);
230
+
231
+ }
232
+
233
+ document.querySelector('#view').append(table);
234
+
235
+ }
236
+
237
+ document.addEventListener('click',function(e){
238
+
239
+ var t=e.target;
240
+
241
+ if(t.id=="prev"){
242
+
243
+ d.setDate(1);
244
+
245
+ d.setMonth(d.getMonth()-2);
246
+
247
+ setView(d);
248
+
249
+ e.preventDefault();
250
+
251
+ }
252
+
253
+ if(t.id=="next"){
254
+
255
+ d.setDate(1);
256
+
257
+ d.setMonth(d.getMonth());
258
+
259
+ setView(d);
260
+
261
+ e.preventDefault();
262
+
263
+ }
264
+
265
+ });
266
+
267
+ });
268
+
269
+
270
+
271
+ ```

1

ついき

2018/06/05 07:48

投稿

yambejp
yambejp

スコア114837

test CHANGED
@@ -79,3 +79,101 @@
79
79
  <div id="view"></div>
80
80
 
81
81
  ```
82
+
83
+
84
+
85
+ # 追記
86
+
87
+ tableにあてはめる?
88
+
89
+ ```javascript
90
+
91
+ <script>
92
+
93
+ window.addEventListener('DOMContentLoaded', function(e){
94
+
95
+ var ym=document.querySelector('#ym');
96
+
97
+ var d=new Date();
98
+
99
+ d.setDate(1);
100
+
101
+ setView(d);
102
+
103
+ function setView(d){
104
+
105
+ var m=d.getMonth()+1;
106
+
107
+ ym.textContent=d.getFullYear()+"年"+(d.getMonth()+1)+"月";
108
+
109
+ var youbi=["日","月","火","水","木","金","土"];
110
+
111
+ document.querySelector('#view').textContent="";
112
+
113
+ var table=document.createElement('table');
114
+
115
+ table.setAttribute("border","1");
116
+
117
+ while(d.getMonth()+1==m){
118
+
119
+ var tr=document.createElement('tr');
120
+
121
+ var td=document.createElement('td');
122
+
123
+ td.append(document.createTextNode(m+"/"+d.getDate()+" "+youbi[d.getDay()]));
124
+
125
+ tr.append(td);
126
+
127
+ table.append(tr);
128
+
129
+ d.setDate(d.getDate()+1);
130
+
131
+ }
132
+
133
+ document.querySelector('#view').append(table);
134
+
135
+ }
136
+
137
+ document.addEventListener('click',function(e){
138
+
139
+ var t=e.target;
140
+
141
+ if(t.id=="prev"){
142
+
143
+ d.setDate(1);
144
+
145
+ d.setMonth(d.getMonth()-2);
146
+
147
+ setView(d);
148
+
149
+ e.preventDefault();
150
+
151
+ }
152
+
153
+ if(t.id=="next"){
154
+
155
+ d.setDate(1);
156
+
157
+ d.setMonth(d.getMonth());
158
+
159
+ setView(d);
160
+
161
+ e.preventDefault();
162
+
163
+ }
164
+
165
+ });
166
+
167
+ });
168
+
169
+ </script>
170
+
171
+ <a href="#" id="prev">prev</a>
172
+
173
+ <span id="ym"></span>
174
+
175
+ <a href="#" id="next">next</a>
176
+
177
+ <div id="view"></div>
178
+
179
+ ```