回答編集履歴
1
chousei
test
CHANGED
|
@@ -155,3 +155,97 @@
|
|
|
155
155
|
- rowspan=1・・・rowspanを出力しないでtdを出力
|
|
156
156
|
|
|
157
157
|
- rowspan>1・・・rowspanを出力してtdを出力
|
|
158
|
+
|
|
159
|
+
|
|
160
|
+
|
|
161
|
+
# 完成形
|
|
162
|
+
|
|
163
|
+
```javascript
|
|
164
|
+
|
|
165
|
+
<script>
|
|
166
|
+
|
|
167
|
+
var a= [
|
|
168
|
+
|
|
169
|
+
["都道府県", "性別", "年齢"],
|
|
170
|
+
|
|
171
|
+
["神奈川県", "男性", 24],
|
|
172
|
+
|
|
173
|
+
["神奈川県", "女性", 24],
|
|
174
|
+
|
|
175
|
+
["東京都", "男性", 32],
|
|
176
|
+
|
|
177
|
+
["東京都", "女性", 18],
|
|
178
|
+
|
|
179
|
+
["東京都", "男性", 32],
|
|
180
|
+
|
|
181
|
+
["千葉県", "男性", 18],
|
|
182
|
+
|
|
183
|
+
["埼玉県", "男性", 48],
|
|
184
|
+
|
|
185
|
+
];
|
|
186
|
+
|
|
187
|
+
var b=a.map(currentValue=>currentValue.map(currentValue=>{
|
|
188
|
+
|
|
189
|
+
return {value:currentValue,rowspan:1};
|
|
190
|
+
|
|
191
|
+
}));
|
|
192
|
+
|
|
193
|
+
b.forEach((currentValue_0,index_0,array_0)=>{
|
|
194
|
+
|
|
195
|
+
currentValue_0.forEach((currentValue_1,index_1)=>{
|
|
196
|
+
|
|
197
|
+
for(var i=index_0+1;i<array_0.length;i++){
|
|
198
|
+
|
|
199
|
+
var nextValue=array_0[i][index_1];
|
|
200
|
+
|
|
201
|
+
if(currentValue_1.rowspan==0 ||
|
|
202
|
+
|
|
203
|
+
nextValue.value!==currentValue_1.value) break;
|
|
204
|
+
|
|
205
|
+
nextValue.rowspan=0;
|
|
206
|
+
|
|
207
|
+
currentValue_1.rowspan++;
|
|
208
|
+
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
});
|
|
212
|
+
|
|
213
|
+
});
|
|
214
|
+
|
|
215
|
+
window.addEventListener('DOMContentLoaded', function(e){
|
|
216
|
+
|
|
217
|
+
var t1=document.querySelector('#t1');
|
|
218
|
+
|
|
219
|
+
b.forEach(currentValue_0=>{
|
|
220
|
+
|
|
221
|
+
var tr=document.createElement('tr');
|
|
222
|
+
|
|
223
|
+
t1.appendChild(tr);
|
|
224
|
+
|
|
225
|
+
currentValue_0.forEach(currentValue_1=>{
|
|
226
|
+
|
|
227
|
+
var rowspan=currentValue_1.rowspan;
|
|
228
|
+
|
|
229
|
+
if(rowspan>0){
|
|
230
|
+
|
|
231
|
+
var td=document.createElement('td');
|
|
232
|
+
|
|
233
|
+
td.textContent=currentValue_1.value;
|
|
234
|
+
|
|
235
|
+
if(rowspan>1) td.setAttribute('rowspan',rowspan);
|
|
236
|
+
|
|
237
|
+
tr.appendChild(td);
|
|
238
|
+
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
});
|
|
242
|
+
|
|
243
|
+
});
|
|
244
|
+
|
|
245
|
+
});
|
|
246
|
+
|
|
247
|
+
</script>
|
|
248
|
+
|
|
249
|
+
<table id="t1" border></table>
|
|
250
|
+
|
|
251
|
+
```
|