Question

我需要从表中除第一个tr的每个tr中返回第一个td的逗号分隔值列表。

在下面的html表示例中，我需要返回：

41536，41537

<table class="product-options">
<tbody>
<tr class="top-row">
<td>NEW Code</td>
<td>OLD Code</td>
<td>Other Code</td>
</tr>
<tr>
<td>41536</td>
<td>40227</td>
<td>60544</td>
</tr>
<tr>
<td>41537</td>
<td>41097</td>
<td>58974</td>
</tr>
</tbody>
</table>

Answer 1

document.querySelectorAll('table.product-options > tbody > tr:not(:first-child) > td:first-child')

querySelectorAll返回一个NodeList。

tr:not(:first-child)返回除第一行外的所有行。

td:first-child返回第一个单元格。

Answer 2

我建议您阅读CSS Selectors

使用document.querySelectorAll和正确的查询很容易：

在这种情况下，我们使用:not来选择我们不想要的tr和:first-child。我们想要的第一个TD

table.product-options tr:not(.top-row) > td:first-child

const list = document.querySelectorAll("table.product-options tr:not(.top-row) > td:first-child");
console.log(list);

<table class="product-options">
  <tbody>
    <tr class="top-row">
      <td>NEW Code</td>
      <td>OLD Code</td>
      <td>Other Code</td>
    </tr>
    <tr>
      <td>41536</td>
      <td>40227</td>
      <td>60544</td>
    </tr>
    <tr>
      <td>41537</td>
      <td>41097</td>
      <td>58974</td>
    </tr>
  </tbody>
</table>

Answer 3

function () {
  let node = 'table.product-options tr:not(.top-row) td:first- 
child'
  let Sku = document.querySelectorAll(node);

  return Array.prototype.map.call(Sku, function(node) {
    return node.textContent.replace(/\s/g, '');
  });
}

获取表中所有第一项的值，但使用Javascript除外

3 个答案: