0

谁知道为什么这在世界上不起作用：

$( "p  p" ).each(function() {
    $(this).css("color", "green");
});

以及“p > p”，或任何带有嵌套段落元素的东西。虽然可以使用 div 和其他元素

例如检查这个：

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

<script>
  alert('length='+$('p p').length); // 0
</script>

<div style="border:1px solid;">
  <p>The first paragraph in  div.</p>
  <p>The second paragraph in div (and the 2nd child in this div).</p>
  <p>
    <span>Span within p (WILL BE fount as "p > span")</span>
    <p>P within p (1).</p> 
    <span>Span within p (will NOT be fount as "p > span")</span>
    <p>P within p (2).</p>
  </p>
</div>
<p>
    <span>Span within p (WILL BE fount as "p > span")</span>
    <p>P within p (1).</p> 
    <span>Span within p (will NOT be fount as "p > span")</span>

4

2 回答 2

0

如果你在调试工具中检查渲染的 html，你会发现，<p>你嵌套的元素都不再嵌套。它们被渲染为一个单独的元素。因此，我渲染了 html，并且您将使用$('p p')or来操作 DOM $('p>p')，不存在具有上述表达式或 DOM 操作语法的元素。

<div style="border:1px solid;">
  <p>The first paragraph in  div.</p>
  <p>The second paragraph in div (and the 2nd child in this div).</p>
  <p>
    <span>Span within p (WILL BE fount as "p &gt; span")</span>
    </p><p>P within p (1).</p> 
    <span>Span within p (will NOT be fount as "p &gt; span")</span>
    <p>P within p (2).</p>
  <p></p>
</div>
<p>
    <span>Span within p (WILL BE fount as "p &gt; span")</span>
    </p><p>P within p (1).</p> 
    <span>Span within p (will NOT be fount as "p &gt; span")</span>

正如@Ish 和@j08691 所说，<p>标签不能嵌套，您可以借助浏览器的调试工具在浏览器中清楚地看到。如需更多参考，请查看另一个SO答案

于 2016-08-30T20:59:53.850 回答
-2

只需将您的 P 标签更改为 SPAN 即可：

jQuery("span").find('span').each(function() {
    jQuery(this).css("color", "green");
});

这是工作演示https://jsfiddle.net/0gqL9q3c/

于 2016-08-30T20:48:13.243 回答