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

回答編集履歴

1

sample

2016/09/26 08:44

投稿

yambejp
yambejp

スコア117919

answer CHANGED
@@ -1,1 +1,54 @@
1
- 一行で表示するもの用意しておいて、読み込み後2行に変換してみては?
1
+ 一行で表示するもの用意しておいて、読み込み後2行に変換してみては?
2
+
3
+ # サンプル
4
+ たとえばこんな感じでどうでしょうか?
5
+ ```script
6
+ $(function(){
7
+ $('th.shosai').remove();
8
+ $('td.shosai').each(function(){
9
+ var parent_tr=$(this).parent('tr');
10
+ var new_tr=document.createElement('tr');
11
+ $(this).get(0).setAttribute('colspan','4');
12
+ $(this).remove().appendTo(new_tr);
13
+ parent_tr.after(new_tr.outerHTML);
14
+ });
15
+ });
16
+
17
+ ```
18
+
19
+ ```HTML
20
+ <table border>
21
+ <thead>
22
+ <tr>
23
+ <th>日付</th>
24
+ <th>名前</th>
25
+ <th>出身地</th>
26
+ <th>ステータス</th>
27
+ <th class="shosai">詳細</th>
28
+ </tr>
29
+ </thead>
30
+ <tbody>
31
+ <tr>
32
+ <td>2000/10/10</td>
33
+ <td>徳川家康</td>
34
+ <td>愛知県</td>
35
+ <td>良好</td>
36
+ <td class="shosai">詳細テキスト</td>
37
+ </tr>
38
+ <tr>
39
+ <td>2000/10/10</td>
40
+ <td>徳川家康</td>
41
+ <td>愛知県</td>
42
+ <td>良好</td>
43
+ <td class="shosai">詳細テキスト</td>
44
+ </tr>
45
+ <tr>
46
+ <td>2000/10/10</td>
47
+ <td>徳川家康</td>
48
+ <td>愛知県</td>
49
+ <td>良好</td>
50
+ <td class="shosai">詳細テキスト</td>
51
+ </tr>
52
+ </tbody>
53
+ </table>
54
+ ```