Rumah > hujung hadapan web > tutorial js > jquery :first-child选择器在这种情况下为什么会无效呢?

jquery :first-child选择器在这种情况下为什么会无效呢?

黄舟
Lepaskan: 2017-06-23 14:32:40
asal
1704 orang telah melayarinya

为什么多了那个h2标签,jQuery中的first-child就无法生效呢?见下图所示。谢谢了

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js">
</script>
<script type="text/javascript"> $(document).ready(function(){
$(&#39;div p:first-child&#39;).css(&#39;backgroundColor&#39;, &#39;#555&#39;);
});
</script>	
</head>
<body>
<html>
<div>
    <h2>hello</h2>
    <p>A</p>
    <p>B</p>
    <p>C</p>
    </div>
    <div>
    <p>D</p>
    <p>E</p>
    <p>F</p></div>
    <div>
    <p>G</p>
    <p>H</p>
    <p>I</p>
    </div>
    </body>
    </html>
Salin selepas log masuk

1591.jpg

first-child只会遍历到第一个子元素

因第一个div里,没有第一个且p的元素

$("div > p").first()
Salin selepas log masuk

但是选择的是p标签,并不是h2啊?

$("div > p").first()
Salin selepas log masuk

不行。只有A有效果,D和G没有效果。

nth-of-type
Salin selepas log masuk

Atas ialah kandungan terperinci jquery :first-child选择器在这种情况下为什么会无效呢?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan