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

jQueryで複数のテキストを取得する方法

 テーブル内のテキストを取得してグラフを描画する際に用いました。

HTML

<table>
  <tr>
    <th>1月</th><td class='item'>10</td><td class='user'>3</td>
    <th>2月</th><td class='item'>5</td><td class='user'>1</td>
    <th>3月</th><td class='item'>20</td><td class='user'>4</td>
    <th>4月</th><td class='item'>30</td><td class='user'>6</td>
    <th>5月</th><td class='item'>10</td><td class='user'>2</td>
    <th>6月</th><td class='item'>25</td><td class='user'>4</td>
    <th>7月</th><td class='item'>25</td><td class='user'>5</td>
    <th>8月</th><td class='item'>40</td><td class='user'>9</td>
    <th>9月</th><td class='item'>35</td><td class='user'>7</td>
    <th>10月</th><td class='item'>20</td><td class='user'>5</td>
    <th>11月</th><td class='item'>10</td><td class='user'>2</td>
    <th>12月</th><td class='item'>5</td><td class='user'>1</td>
  </tr>
</table>

JavaScript

  var item_count = [];
  var user_count = [];

  jQuery.noConflict();
  jQuery(document).ready(function($){
    for(var i=0; i<$('.item').length; i++){
      item_count[i] = [i+1, $('.item:eq('+i+')').text()];
      user_count[i] = [i+1, $('.user:eq('+i+')').text()];
    }
  });

 セレクタを利用してi回目のループでi番目の要素からテキストを取得します。item_countとuser_countはグラフを描画する際に用います。