回答編集履歴

2

追記

2016/10/31 23:22

投稿

date
date

スコア1820

test CHANGED
@@ -11,3 +11,277 @@
11
11
  19:14追記
12
12
 
13
13
  [JavaScriptで、html上のとあるclassを持つ要素を軒並み非表示にしたいとき](http://qiita.com/TongChang/items/0659fba7b9d4aaa46a7b)
14
+
15
+
16
+
17
+ 11/01 8:20
18
+
19
+ 動作を他人でも確認できるように
20
+
21
+ ```HTML
22
+
23
+ <!DOCTYPE html>
24
+
25
+ <html>
26
+
27
+ <head>
28
+
29
+ <script>
30
+
31
+ function show_block(){
32
+
33
+ var element = document.getElementsByClassName("hoge");
34
+
35
+ for (var i=0;i<element.length;i++) {
36
+
37
+ if(element[i].style.display =="none"){
38
+
39
+ element[i].style.display = "block";
40
+
41
+ }else{
42
+
43
+ element[i].style.display = "none";
44
+
45
+ }
46
+
47
+ }
48
+
49
+ }
50
+
51
+ </script>
52
+
53
+ </head>
54
+
55
+ <body>
56
+
57
+ <input type="button" onclick="show_block()" value="表示切替">
58
+
59
+ <table border="1" class="hoge" id="hoge1">
60
+
61
+ <tr>
62
+
63
+ <td>chouchou シュシュ</td>
64
+
65
+ </tr>
66
+
67
+ <tr>
68
+
69
+ <td>139.735923551435.6876048451</td>
70
+
71
+ </tr>
72
+
73
+ <tr>
74
+
75
+ <td>東京都千代田区六番町3-11 テシコ六番町ビル 2F</td>
76
+
77
+ </tr>
78
+
79
+ </table>
80
+
81
+ <table border="1" class="hoge" id="hoge2">
82
+
83
+ <tr>
84
+
85
+ <td>北海道 池袋西口店</td>
86
+
87
+ </tr>
88
+
89
+ <tr>
90
+
91
+ <td>139.708707784135.7297002089</td>
92
+
93
+ </tr>
94
+
95
+ <tr>
96
+
97
+ <td>東京都豊島区西池袋1-10-8 サン・グロウビル3F</td>
98
+
99
+ </tr>
100
+
101
+ </table>
102
+
103
+ <table border="1" class="hoge" id="hoge3">
104
+
105
+ <tr>
106
+
107
+ <td>ワイン居酒屋 ワイのすけ</td>
108
+
109
+ </tr>
110
+
111
+ <tr>
112
+
113
+ <td>139.757721240035.6644644218</td>
114
+
115
+ </tr>
116
+
117
+ <tr>
118
+
119
+ <td>東京都港区新橋4-19-4 コンシェリア新橋B1</td>
120
+
121
+ </tr>
122
+
123
+ </table>
124
+
125
+ <table border="1" class="hoge" id="hoge4">
126
+
127
+ <tr>
128
+
129
+ <td>大衆酒場 ちばチャン 渋谷店</td>
130
+
131
+ </tr>
132
+
133
+ <tr>
134
+
135
+ <td>139.698536952735.6612359822</td>
136
+
137
+ </tr>
138
+
139
+ <tr>
140
+
141
+ <td>東京都渋谷区宇田川町13-8 ちとせ会館4F</td>
142
+
143
+ </tr>
144
+
145
+ </table>
146
+
147
+ <table border="1" class="hoge" id="hoge5">
148
+
149
+ <tr>
150
+
151
+ <td>琉歌 りゅうか 上野本店</td>
152
+
153
+ </tr>
154
+
155
+ <tr>
156
+
157
+ <td>139.774045532335.7097733686</td>
158
+
159
+ </tr>
160
+
161
+ <tr>
162
+
163
+ <td>東京都台東区上野4-8-10 第3 SEIKA BLD123</td>
164
+
165
+ </tr>
166
+
167
+ </table>
168
+
169
+ <table border="1" class="hoge" id="hoge6">
170
+
171
+ <tr>
172
+
173
+ <td>SU・KU・RA サクラ 赤羽東口店</td>
174
+
175
+ </tr>
176
+
177
+ <tr>
178
+
179
+ <td>139.721910807135.7784928403</td>
180
+
181
+ </tr>
182
+
183
+ <tr>
184
+
185
+ <td>東京都北区赤羽1-3-7 大澤ビル2階</td>
186
+
187
+ </tr>
188
+
189
+ </table>
190
+
191
+ <table border="1" class="hoge" id="hoge7">
192
+
193
+ <tr>
194
+
195
+ <td>BEONE ベオーネ 新宿店</td>
196
+
197
+ </tr>
198
+
199
+ <tr>
200
+
201
+ <td>139.702236729435.6935946592</td>
202
+
203
+ </tr>
204
+
205
+ <tr>
206
+
207
+ <td>東京都新宿区歌舞伎町1-16-1 東京第20ビル7F</td>
208
+
209
+ </tr>
210
+
211
+ </table>
212
+
213
+ <table border="1" class="hoge" id="hoge8">
214
+
215
+ <tr>
216
+
217
+ <td>ハヌリ 新宿歌舞伎町ゴジラ通り</td>
218
+
219
+ </tr>
220
+
221
+ <tr>
222
+
223
+ <td>139.701693956535.6946214735</td>
224
+
225
+ </tr>
226
+
227
+ <tr>
228
+
229
+ <td>東京都新宿区歌舞伎町1-18-9-9F</td>
230
+
231
+ </tr>
232
+
233
+ </table>
234
+
235
+ <table border="1" class="hoge" id="hoge9">
236
+
237
+ <tr>
238
+
239
+ <td>十米 新橋SL広場駅前店</td>
240
+
241
+ </tr>
242
+
243
+ <tr>
244
+
245
+ <td>139.757333969035.6665005712</td>
246
+
247
+ </tr>
248
+
249
+ <tr>
250
+
251
+ <td>東京都港区新橋2-16-1 ニュー新橋ビル203</td>
252
+
253
+ </tr>
254
+
255
+ </table>
256
+
257
+ <table border="1" class="hoge" id="hoge10">
258
+
259
+ <tr>
260
+
261
+ <td>月島スペインクラブ</td>
262
+
263
+ </tr>
264
+
265
+ <tr>
266
+
267
+ <td>139.782315209135.6658040954</td>
268
+
269
+ </tr>
270
+
271
+ <tr>
272
+
273
+ <td>東京都中央区月島1-14-7旭倉庫1F</td>
274
+
275
+ </tr>
276
+
277
+ </table>
278
+
279
+ </body>
280
+
281
+ </html>
282
+
283
+
284
+
285
+
286
+
287
+ ```

1

追記

2016/10/31 23:22

投稿

date
date

スコア1820

test CHANGED
@@ -5,3 +5,9 @@
5
5
  ただtableはphpのfor each文で10個作成する
6
6
 
7
7
  ぐらいの事でいいのではないのかな
8
+
9
+
10
+
11
+ 19:14追記
12
+
13
+ [JavaScriptで、html上のとあるclassを持つ要素を軒並み非表示にしたいとき](http://qiita.com/TongChang/items/0659fba7b9d4aaa46a7b)