Question

我有一个简单的HTML布局，如下所示：

<html>
  <head>
    <title>HTML Page</title>
  </head>
  <body>
    <table>
      <tr>
        <td>
          <a href="some.html">Text</a>
        </td>
      </tr>
    </table>
  </body>
</html>

我正在尝试使用这样的选择器选择第一个td：

html > body > table > tr:nth(0) > td:nth(0) > a

不幸的是，当我将它包装在try catch块中时，这似乎不起作用并且给我一个错误说“未定义的对象”。

有没有人见过这个？

EEF

Answer 1

您无需从“html”开始。想一想：这比仅仅从“身体”开始更好吗？我认为你也不需要那种亲子特异性。我敢打赌：

$('table td:first')

应该就是您所需要的一切。

Answer 2

“选择第一个td” - $('td:first')或$('td').first()。

有关详细信息，请参阅:first Selector和.first()的文档。

Answer 3

tr不在table内，即使它看起来像是你的标记。每行都放在thead，tbody或tfoot元素中，如果省略<tbody>开始标记，浏览器会为您静默插入。所以要选择你要说的行：

table>tbody>tr

这是由于HTML解析的一个怪癖，在许多情况下允许省略start-tags（例如，如果省略<body>，浏览器会认为它在第一次遇到某个页面时就在那里含量）。

但是，XHTML有更常规的解析规则，结果就是如果在XML模式下解析页面，就不会有隐含的tbody。因此，编写一个在两种情况下都匹配的选择器会更加困难。

此外，nth选择器是选择器的非标准jQuery扩展，它将导致使用缓慢的JavaScript'Sizzle'选择器引擎而不是浏览器的快速内置选择器引擎（如果可用，即。不是IE6-7）。尽量坚持使用标准的CSS选择器来避免这种情况。

最好通过使用DOM样式遍历而不是选择器来获取所需的元素来避免这两个问题。 DOM本身在表和行上提供rows和cells列表，这可能比jQuery提供的更容易：

var table= $('#someselector table').get(0);   // however you access the table
var cell= table.rows[0].cells[0];             // or whatever rows/column you want
$(cell).doSomething();                        // ...

Answer 4

我相信您需要将该选择器修改为以下内容：

$('html > body > table > tbody > tr:nth(0) > td').html()

如果可能的话，我会尝试将类/ id添加到你的元素中，以避免像这样的模糊（ish）选择器的潜在问题。

Answer 5

你的大多数选择器都没用。尝试：

$("td:first > a");

它会选择文档中第一个a的{{1}}子项。

如果你有更多的表，你可能想要添加一个id，然后你可以通过以下方式选择它：

td

IE 6 JQuery选择器

5 个答案: