为什么不> tr> td工作时使用子选择器？ [英] Why doesn't table > tr > td work when using the child selector?

问题描述

我不能真正得到为什么下面的选择器按预期工作（即得到 td ）：

  table tr td 
  

/ p>

 表> tr> td 
  

td code> tr ，后者又是 table 的后代，但它们也是对方的子对象。因此，我认为> 选择器也可以工作。

我做了两个fiddles：

1. 儿童： http://jsfiddle.net/brLee/


2. 后代： http://jsfiddle.net/brLee/1/

为什么>

解决方案

在HTML中，浏览器隐式添加一个 tbody 元素， c $ c> tr 元素 ¹ ，因此在现实中， tr 从不是表。

因此，您必须这样做：

  table> tbody> tr> td 
  

当然，如果添加 tbody 元素自己，你使用相同的选择器。 规范说明了 tbody 何时为

A 如果 tbody 元素中的第一个元素是 tr 元素，如果元素之前没有结束标记的 tbody thead 或 tfoot 省略。

---

¹ _{适当地作为 application / xhtml + xml 的XHTML文档的情况，但是给定它的XML根。}

I can't really get why the following selector works as expected (i.e. get the td):

table tr td

but this one doesn't:

table > tr > td

The td is a descendant of tr, which in turn is a descendant of table, but they are also children of each other. Therefore, I thought that the > selector would work too.

I made two fiddles:

1. Child: http://jsfiddle.net/brLee/
2. Descendant: http://jsfiddle.net/brLee/1/

Why isn't the > selector working here?

解决方案

In HTML, browsers implicitly add a tbody element within which to contain the tr elements¹, so in reality, tr is never a child of table.

Consequently, you have to do this instead:

table > tbody > tr > td

Of course, if you add a tbody element yourself, you use the same selector. The spec explains when a tbody is added implicitly otherwise:

Tag omission

A tbody element's start tag may be omitted if the first thing inside the tbody element is a tr element, and if the element is not immediately preceded by a tbody thead, or tfoot element whose end tag has been omitted.

---

¹ _{This is not the case for XHTML documents that are properly served as application/xhtml+xml, however, given its XML roots.}

这篇关于为什么不> tr> td工作时使用子选择器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！