読者です 読者をやめる 読者になる 読者になる

jquery5

<html lang="ja">
<head>
    <meta charset="utf-8">
    <title>jQueryの練習</title>
    <style>
    table{
        margin: 15px auto 10px auto;
    }


    th{
        padding:5px;
        background:#266;
        border:1px solid #777;
        color: #fff;
    }



    td{
        border:solid 1px #777;
        background:#eee;
        padding:5px;
    }


    table tr.odd td {
        background: #ccc;
    }
    </style>
</head>

<body>
<table id="testTable" border="1">
<tbody><tr>
<th>関東</th>
<td>東京</td>
</tr>
<tr>
<th>関東</th>
<td>千葉</td>
</tr>
<tr>
<th>関東</th>
<td>神奈川</td>
</tr>
<tr>
<th>近畿</th>
<td>大阪</td>
</tr>
<tr>
<th>近畿</th>
<td>兵庫</td>
</tr>
<tr>
<th>近畿</th>
<td>京都</td>
</tr>
</tbody></table>

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function(){
 $('#testTable').each(function () {
  var pre_element = null;
  var col_num = 0;
  $(this).find('tr').each(function () {
   var now_th = $(this).find('th').eq( col_num );
   if (pre_element == null) {
    pre_element = now_th;
    console.log(now_th.text());
   } else if (now_th.text() == pre_element.text()) {
         console.log(now_th.text());
    now_th.remove();
    if (pre_element.attr('rowspan') == null) pre_element.attr('rowspan', 1);
     pre_element.attr('rowspan', parseInt(pre_element.attr('rowspan'),10) + 1);
    } else {
          console.log(now_th.text());
     pre_element = now_th;
    }
  });
 });
});
</script>
</body>
</html>