javascript - 如何使用 jQueryeach 函数从 html 表中提取数据

Question

我需要从 html 表中提取数据来创建 JSON 数组。

这是 HTML 表格的结构，

    <table class="tableClass">
        <thead class="tableHeaderClass" >
           <tr>
              <th>header_column1</th>
              <th>header_column2</th>
              <th>header_column3</th>
           </tr>
        </thead>
        <tbody class="tableBodyClass">
           <tr>
              <td>row1_column1</td>
              <td>row1_column2</td>
              <td>row1_column3</td>
           </tr>
           <tr>
             <td>row2_column1</td>
             <td>row2_column2</td>
             <td>row2_column3</td>
           </tr>
         </tbody>
    </table>

在我的 JavaScript 函数中，我正在这样做

  function() {

    var json = {
        header_column1 : '',
        header_column2 : '',
        header_column3 : ''
    };

    var data = [];
    $('tableClass').find('tbody').children('tr').each(function() {
         var $tds = $(this).find('td');
         json.header_column1 = $tds.eq(0).text();
         json.header_column2 = $tds.eq(1).text();
         json.header_column3 = $tds.eq(2).text();

         data.push(json);
    });

    return data;

 }

当我打印数组时，但我只得到“row2_column1、row2_column2、row2_column3”。

无法找出我做错/错过的事情。如果您能帮我解决这个问题，那就太好了。

Answer 1

$('tableClass')

应该是

$('.tableClass')

调试 jQuery 时，始终将选择器作为最初的嫌疑人。在继续链之前检查他们是否找到了元素。因此:

alert($('tableClass').length)

...将为您提供0。

(旁注:

$('tableClass').find('tbody').children('tr')

可以缩短为

$('tableClass').find('> tbody > tr')