6

标题几乎说明了一切。
给定一张像

<table>
  <tr>
    <th>Header 1</td>
    <th>Header 2</td>
  </tr>
  <tr>
    <td>Datum 1</td>
    <td> Datum 2</td>
  </tr>
  <tr>
    <td>Datum 1</td>
    <td> Datum 2</td>
  </tr>
</table>

如何选择包含第 th 个标题而不包含其他标题的行？

4

5 回答 5

26

表达：

$(function() {
  $("tr:has(th):not(:has(td))").hide();
});

甚至只是：

$(function() {
  $("tr:not(:has(td))").hide();
});

完整示例：

<html>
<head>
  <title>Layout</title>
</head>
<body>
<table>
  <tr>
    <th>Header 1</td>
    <th>Header 2</td>
  </tr>
  <tr>
    <td>Datum 1</td>
    <td> Datum 2</td>
  </tr>
  <tr>
    <td>Datum 1</td>
    <td> Datum 2</td>
  </tr>
  <tr>
    <th>Header 3</th>
    <th>Datum 2</td>
  </tr>
</table>
<script src="http://www.google.com/jsapi"></script>
<script>
  google.load("jquery", "1.3.1");
  google.setOnLoadCallback(function() {
    $(function() {
      $("tr:has(th):not(:has(td))").hide();
    });
  });
</script>
</body>
</html>
于 2009-02-09T23:26:11.520 回答
7

如果可能，最好将表头包含在 <thead> 元素中

<table>
    <thead>
        <tr>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
        </tr>
    </tbody>
</table>

这样，选择表头就很简单了：

$('thead');

或者只选择 <tr>

$('thead tr');

这样您的标记将更具可读性，并且表格样式变得更加容易，因为您可以更轻松地定位表格标题或正文中的元素。

于 2009-02-09T23:49:51.853 回答
4 
jQuery("tr:has(th)")

将选择每一个至少tr包含一个 th

kthxbye :)

于 2009-02-09T23:24:14.503 回答
2

不知道它是否像 Dojo CSS3 查询，但如果 jQuery 支持，您可以使用 first-child 伪类：

tr th：第一个孩子

或者

tr th:nth-child(1)

见：http ://www.456bereastreet.com/archive/200601/css_3_selectors_explained/

于 2009-02-09T23:22:18.690 回答
2

使用:has选择器：

$('tr:has(th)').addClass('sample')

th如果你有一张混合和td儿童的桌子，可能不会工作。

于 2009-02-09T23:25:15.220 回答