父后代 jquery 选择器中的奇怪错误

【问题标题】：Strange error in parent descendant jquery selector父后代 jquery 选择器中的奇怪错误
【发布时间】：2013-10-27 20:52:34
【问题描述】：

我已阅读tutorial about jquery selectors。

提到：

parent descendant - $("div p") - All <p> elements that are descendants of a <div> element

他们提供了一个demo，效果很好：

但我仍然无法弄清楚为什么这不起作用：

<p class="ee">
    <h4><span> The backgroud color don't changed</span></h4>
</p>
<script>
    $(".ee span").css("background-color","yellow");
</script>

jsfiddle DEMO

【问题讨论】：

标签： javascript jquery html css jquery-selectors

【解决方案1】：

你的标记是错误的

<p class="ee">
     <h4><span> The backgroud color don't changed</span></h4>
</p>

你不能在p标签内有<h4>标签

所以browser render这个作为

<p class="ee"></p>
     <h4><span> The backgroud color don't changed</span></h4>
<p></p>

所以你下面的选择器不起作用。因为类内没有span ee

$(".ee span").css("background-color","yellow");

P 元素代表一个段落。它不能包含块级元素（包括 P 本身）。

http://www.w3.org/TR/html401/struct/text.html#h-9.3.1

【讨论】：