Question

我想得到th的所有列值。例如在this Fiddle当我访问时，我希望获得该列中的所有td。

$(document).ready(function(){
$('.tableizer-table th').each(function(index,val){

       $('.tableizer-table tr td').eq(index).each(function (index,value) {
        console.log(value);
       });


  });
  });

以上代码无效。

Answer 1

这可以获得每列的数据，但是知道所需的最终结果会很好，就像@Thinker询问的那样：

$(document).ready(function(){
  $('.tableizer-table th').each(function(index,val){
    console.log(index);
    $('.tableizer-table tr').each(function() {
       console.log($($(this).find('td')[index]).text())
    });
  });
});

Answer 2

你可以按照这样的列

获取数据

（注意：点击后会收到数据）

$('.tableizer-table th').click(function() {
  var getData = [];
  for (var i = 0; i < $(".tableizer-table tbody tr").length; i++) {
getData.push($(".tableizer-table tbody tr td").eq($(this).index()).text());
  }
  alert(getData)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="tableizer-table display cell-border" cellspacing="0" width="100%">
  <thead>
    <th>Item#</th>
    <th>Family</th>
    <th>Grade</th>
    <th>Characteristics</th>
    <th>Full Description</th>
    <th>Format</th>
    <th>UOM</th>
    <th> Price </th>
    <th>Updated</th>
    <th>Source</th>
  </thead>
  <tbody>
    <tr>
      <td>Alloy (HR) Cast - HA (10 Cr Bal Fe) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $0.192 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
    <tr>
      <td>Alloy (HR) Cast - HC (26 Cr, 4 Ni) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $0.556 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
    <tr>
      <td>Alloy (HR) Cast - HD (26 Cr 6 Ni) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $0.647 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
    <tr>
      <td>Alloy (HR) Cast - HE (26 Cr 10 Ni) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $0.848 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
    <tr>
      <td>Alloy (HR) Cast - HF (20 Cr 10 Ni) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $0.789 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
    <tr>
      <td>Alloy (HR) Cast - HH (25 Cr, 12 Ni ) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $0.935 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
    <tr>
      <td>Alloy (HR) Cast - HI (26 Cr, 5 Ni) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $1.090 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
    <tr>
      <td>Alloy (HR) Cast - HK (25 Cr, 20 Ni ) (CPO)</td>
      <td>Metal_Alloy</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>Heat-Resistant Casting Alloys (Price based on item's commodity ingredients only. No processing)</td>
      <td>Market Price of components</td>
      <td>USD/LB</td>
      <td> $1.323 </td>
      <td>10/23/15</td>
      <td>MetalPricing.com (CPO)</td>
    </tr>
  </tbody>
</table>

希望有所帮助：）

Answer 3

我假设当您悬停或访问列标题时，您希望将该列下的所有td元素写入控制台。

$(document).ready(function(){
    $('.tableizer-table th').on('hover', function(){
        var columnIndex = $(this).parent().index($(this));

        $('.tableizer-table tbody tr').each(function() {
            console.log($(this).children('td').eq(columnIndex).text());
        });
    });
});

Answer 4

所以你不想要html，只需要文字？

在class Foo { exists() { console.log("exists"); } isBorn() { console.log("isBorn"); } } (new Foo).exists();

中使用$(this).text()代替value

Answer 5

为什么不为所需的单元格指定唯一的类名，然后通过一次调用提取整个类：

    $('.mycolumnX')

然后你可以循环遍历数组中的结果。

从html数据中获取列数据

5 个答案: