javascript - 使用 JQuery 迭代到除第一列之外的表

Question

我想为表格中除第一列以外的每个单元格调用一个函数。到目前为止，我有以下代码:

<script type="text/javascript">

  $("#resultstable tr").each(function () {

    $('td', this).each(function () {
         ....do my staff...
     })

})
</script>

这会将函数应用于我表格中的每个单元格。如果我将代码更改为此，我认为它会起作用，但它不起作用。

<script type="text/javascript">

  $("#resultstable tr").each(function () {

    $('td :not(:first-child)', this).each(function () {
         ....do my staff...
     })

})
</script>

Answer 1

只需切片元素:

$("<selector>").slice(1).each(function () {...});

.slice( start [, end ] )

Description: Reduce the set of matched elements to a subset specified by a range of indices.

另一个有效解决方案是使用:not 和:first 构建意大利面条选择器:

$("tr").each(function () {
   $("td:not(:first)", this).each(function () {
       // do something
   });
});

例子

var colors = ["#f1c40f", "#2ecc71"];
$("table tr").each(function() {
  $("td", this).slice(1).each(function(i) {
    $(this).css("background", colors[i])
  });
});

setTimeout(function() {
  $("table tr").each(function() {
    $("td:not(:first)", this).each(function(i) {
      $(this).css("background", colors[colors.length - i - 1])
    });
  });
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
  <thead>
    <tr>
      <td>Name</td>
      <td>Age</td>
      <td>Location</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Alice</td>
      <td>19</td>
      <td>Europe</td>
    </tr>
    <tr>
      <td>Bob</td>
      <td>20</td>
      <td>Europe</td>
    </tr>
    <tr>
      <td>Carol</td>
      <td>15</td>
      <td>Australia</td>
    </tr>
  </tbody>
</table>