【jQuery :first-child第一个元素选择器用法】它是一个jQuery选择器用于选择每个元素第一个孩子其父母.
语法如下:
$(":first-child")
返回值:它选择并返回其父级的第一个子元素。
示例1:
<
!DOCTYPE html>
<
html >
<
h1 >
<
center >
Geeks
<
/ center >
<
/ h1 >
<
head >
<
script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" >
<
/ script >
<
script >
$(document).ready(function() {
$("p:first-child").css(
"background-color", "green");
});
<
/ script >
<
/ head >
<
body >
<
div >
<
p >
Geeks for Geeks<
/ p >
<
p >
jQuery<
/ p >
<
p >
First Child Selector<
/ p >
<
/ div >
<
/ body >
<
/ html >
输出如下:
文章图片
示例2:
<
!DOCTYPE html>
<
html >
<
h1 >
<
center >
Geeks
<
/ center >
<
/ h1 >
<
head >
<
script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" >
<
/ script >
<
script >
$(document).ready(function() {
$("p:first-child").css(
"background-color", "green");
});
<
/ script >
<
/ head >
<
body >
<
div style = "border:1px solid;
" >
<
p >
Geeks for Geeks<
/ p >
<
p >
jQuery<
/ p >
<
/ div >
<
br >
<
div style = "border:1px solid;
" >
<
p >
Geeks for Geeks<
/ p >
<
p >
jQuery<
/ p >
<
p >
First Child Selector<
/ p >
<
/ div >
<
div >
jQuery:First Child Selector<
/ div >
<
/ body >
<
/ html >
输出如下:
文章图片
推荐阅读
- 算法设计(打印对称双三角图案)
- 算法设计(模幂(递归)介绍和代码实现)
- Java中的编译时和运行时多态之间的区别
- C++标准模板库(STL)中的双端队列用法介绍
- 大厂面试题,热门前端React面试题及答案详细解析
- 面试必问!最新前端Vue面试题大全及答案详解
- 给定一个二叉搜索树(BST),找到树中第 K 小的节点
- 大厂面试题(已知 sqrt (2)约等于 1.414,要求不用数学库,求 sqrt (2)精确到小数点后 10 位)
- 大厂面试题(如何实现一个高效的单向链表逆序输出())