7.筛选方法

最新推荐文章于 2024-10-02 17:15:49 发布

添砖Java！

最新推荐文章于 2024-10-02 17:15:49 发布

阅读量63

点赞数

分类专栏： java web( jQuery ) 文章标签： html 前端 javascript

本文链接：https://blog.csdn.net/dkbfhbh/article/details/126590639

版权

java web( jQuery ) 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

以下是筛选方法的一部分和使用方法

$("li").first() // 元素集合中的第一个

$("li").last() // 元素集合中的最后一个

$("div").next() // div的下一个兄弟元素

$("div").prev() // div的上一个兄弟元素

$("div").nextAll() // div后面的所有兄弟元素

$("div").prevAll() // div前面的所有兄弟元素

$("div").parent() // div的父元素

$("div").parents() // div的所有直系祖宗元素

$("div").eq(数字) // 指定下标的div元素

$("div").find(选择器) // div后代中的的指定元素

$("div").siblings() // div的所有兄弟标签

$("div").children() // div下的所有子标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div class="yeye">爷爷
			<div class="father">爸爸
				<div class="son">儿子</div>
			</div>
		</div>
		<div class="nav">
			<p>我是屁</p>
			<p>我是屁</p>
			<p class="imet">我是屁</p>
			<p>我是屁</p>
			<p>我是屁</p>
			<div>
				<p>我是p</p>
			</div>
		</div>
		<script src="../js/jquery.js"></script>
		<script>
			//注意一下都是方法,带括号
			$(function(){
				//1.父 parent()   返回的是最近一级元素 亲爸爸
			$(".son").parent().css("color","red");
				//2.子
				//(1) 亲儿子  children()---子代选择器----ul>li
				//$(".nav").children("p").css("color","red")
				//(2)可以选择里面所有的孩子,包括儿子和孙子   find() --类似于子代选择器
				//$(".nav").find("p").css("color","red")
				//3.兄弟元素siblings,除了甚之外的所有亲兄弟
				// $("div .imet").siblings("p").css("color","red")
				
				//4.第n个元素
				//(1)我们可以利用选择器的方式选择
				//$("div p:eq(1)").css("color","red")
				//(2)我们可以利用选择方法的方式选择
				$("div p").eq(3).css("color","red")
			})
		</script>
	</body>
</html>