JQuery学习10篇(子元素过滤器)

最新推荐文章于 2020-05-13 17:54:17 发布

程宇寒

最新推荐文章于 2020-05-13 17:54:17 发布

阅读量130

点赞数

文章标签： JQuery javascript js 子元素过滤器前端开发

本文链接：https://blog.csdn.net/czh500/article/details/103603116

版权

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JQuery学习10篇(子元素过滤器)</title>
<link rel="stylesheet" type="text/css" href="inputAndDiv.css">
</head>
<body style="background-color: #CCE8CF;">
	<h3 style="color: #cd1636;">JQuery学习10篇(子元素过滤器)</h3>
	<div>
	<span>
		<p>韦小宝</p>
		<p>令狐冲</p>
		<p>杨过</p>
	</span>
	</div>
	<div>
		<p>段誉</p>
		<p>乔峰</p>
	</div>
	<div>
		<p>于都县</p>
		<p>兴国县</p>
	</div>
	<ul>
		<li>
			<a href="">江西省赣州市于都县</a>
		</li>
		<li>
			<span>赣州市</span>
			<a href="">于都县</a>
		</li>
	</ul>
</body>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
//同一层次下,最后1个p标签
$('p:last-of-type').css('background','OrangeRed');

//:last-child可以匹配多个，即为每个父级元素匹配最后一个子元素
// $('p:last-child').css('background','red');

//:last只匹配一个单独的元素
// $('p:last').css('background','LimeGreen');

//匹配li下作为独生子的a标签
$('li a:only-child').css('background','PaleVioletRed');
</script>
</html>

程宇寒

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery学习10篇(子元素过滤器)

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>JQuery学习10篇(子元素过滤器)</title><link rel="stylesheet" type="text/css" href="inputAndDiv.css">...
复制链接

扫一扫