Question

我有几个结构相似的HTML表。它们看起来都是这样的：

<table cellspacing="1" cellpadding="7" summary="Procedure Tabulate: Table 1" frame="box" rules="groups" class="table table-bordered table-hover highchart-table">
    <thead>
        <tr>
            <th scope="col" rowspan="2" class="c m Header">&nbsp;</th>
            <th scope="col" class="c Header">3</th>
        </tr>
        <tr>
            <th scope="col" class="c Header">CA R</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th scope="row" class="l t RowHeader">Fours</th>
            <td class="r b Data">10268.64</td>
        </tr>
        <tr>
            <th scope="row" class="l t RowHeader">Hifi</th>
            <td class="r b Data">11267.82</td>
        </tr>
        <tr>
            <th scope="row" class="l t RowHeader">Magneto</th>
            <td class="r b Data">11575.91</td>
        </tr>
        <tr class="blue-bg">
            <th scope="row" class="l t RowHeader">Total</th>
            <td class="r b Data">33112.36</td>
        </tr>
    </tbody>
</table>

我想通过一类highchart-table运行所有表并检索CA R（thead的最后一行的最后一行）并创建关联数组，其中t和td在tbody中除了最终的“总行”之外“（例如：Fours =＆gt; 10268.61，Hifi =＆gt; 11575.91，Magneto =＆gt; 11575.91）。

我的最终目标是创建一个类似这样的数组：

hcArr[0]['ind'] = 'CA R';
hcArr[0]['Fours'] = 10268.61;
hcArr[0]['Hifi'] = 11575.91;
hcArr[0]['Magneto'] = 11575.91;

然后让hcArr[1]包含下一个表格highchart-table的内容。

目前我唯一有效的代码是：

$.each( $( '.highchart-table' ), function( key, value ) {

});

我无法弄清楚如何从当前循环中的表中获取它的行和单元格。

非常感谢任何帮助。

Answer 1

这不是最终解决方案，但是这将为您提供标题单元格中的初始值。你可以从中推断出其他人。 http://jsfiddle.net/tM546/：

var theadValues = $.map($('.highchart-table'), function (idx, el) {
    return $(idx).find('thead tr:last th:last').text();
});

Answer 2

这样的事情应该有效：

var res = [];

$(".highchart-table").each(function() {
  var $$ = $(this), obj = {};
  obj.ind = $(this).find('thead tr:last th:last').text();
  $$.find("tbody th").each(function(){
    obj[$(this).text()] = parseFloat($(this).siblings("td").text());
  });
  res.push(obj);
});

console.log(res);

顺便说一句，javascript中的数组只是数字索引，所以它会返回一个像这样的对象数组：

[
  { "ind": "CA R", "Fours": 10268.64, "Hifi": 11267.82, "Magneto": 11575.91 },
  { "ind": "CA R", "Fours": 10268.64, "Hifi": 11267.82, "Magneto": 11575.91 },
  ...
]

使用jQuery遍历多个html表

2 个答案: