teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

追記

2016/12/02 02:24

投稿

Lhankor_Mhy
Lhankor_Mhy

スコア37502

answer CHANGED
@@ -7,4 +7,73 @@
7
7
 
8
8
 
9
9
  > value string: Returns / Sets the current value of the control.
10
- [HTMLInputElement - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement)
10
+ [HTMLInputElement - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement)
11
+
12
+  
13
+  
14
+  
15
+ ##### コメントを受けて追記
16
+ ```HTML
17
+ <table id="tbl">
18
+ <tr>
19
+ <td>
20
+ <select id="number1">
21
+ <option>001</option>
22
+ <option>002</option>
23
+ </select>
24
+ </td>
25
+ <td>
26
+ <input type="text" id="txt1">
27
+ </td>
28
+ </tr>
29
+ <tr>
30
+ <td>
31
+ <select id="number2">
32
+ <option>001</option>
33
+ <option>002</option>
34
+ </select>
35
+ </td>
36
+ <td>
37
+ <input type="text" id="txt2">
38
+ </td>
39
+ </tr>
40
+ </table>
41
+ <button>
42
+ test
43
+ </button>
44
+ ```
45
+ ```javascript
46
+ var tblData = document.getElementById("tbl");
47
+ document.querySelector('button').addEventListener('click', e => {
48
+ let txtTbldata = '';
49
+ for (var i = 0, rowlen = tblData.rows.length; i < rowlen; i++) {
50
+ for (var j = 0, collen = tblData.rows[i].cells.length; j < collen; j++) {
51
+ txtTbldata += tblData.rows[i].cells[j].children[0].value;
52
+ }
53
+ }
54
+ alert(txtTbldata);
55
+ })
56
+ ```
57
+ [https://jsfiddle.net/pg14qncq/](https://jsfiddle.net/pg14qncq/)
58
+  
59
+ こんな感じでいかが。
60
+  
61
+  
62
+  
63
+ さらに行を少なくするなら、ワンライナーで書けますよ。
64
+ ```javascript
65
+ document.querySelector('button').addEventListener(
66
+ 'click',
67
+ e => alert(
68
+ Array.prototype.reduce.call(
69
+ document.getElementById("tbl").rows,
70
+ ( pv, cv ) => pv + Array.prototype.reduce.call(
71
+ cv.cells,
72
+ ( pv, cv ) => pv + cv.children[0].value,
73
+ ''
74
+ ),
75
+ ''
76
+ )
77
+ )
78
+ );
79
+ ```