jQuery--过滤器【基本过滤器语法使用】详细代码及注释

最新推荐文章于 2024-07-10 14:03:37 发布

月亮困了r

最新推荐文章于 2024-07-10 14:03:37 发布

阅读量481

点赞数

文章标签： jquery javascript 前端

本文链接：https://blog.csdn.net/m0_55877024/article/details/122839961

版权

过滤器

过滤器是一个字符串，用了筛选dom对象的，过滤器是和选择器一起使用的，在选择了dom对象后，在进行过滤筛选。

1---基本过滤器：使用dom对象在数组中的位置，作为过滤条件。

1)：选择数组中第一个dom成员
语法：$("选择器：first")

2)：选择数组中最后一个成员
语法：$("选择器：last")

3)：选择等于下标的dom成员
语法：$("选择器：eq(下标)")

4)：选择大于某个下标的所有成员
语法：$("选择器：gt(下标)")

5)：选择小于某个下标的所有成员
语法：$("选择器：lt(下标)")

详细代码

···

	<script type="text/javascript" src="js/jquery-3.6.0.js">	</script>
	<script type="text/javascript">
		//	$(function() {  }）页面dom对象加载后执行
		$(function(){
			//绑定事件
			$("#btn").click(function(){
				alert("button点击了，执行处理函数")
			})
			//btn1事件 获取数组中第一个dom成员
			$("#btn1").click(function(){
				var obj=$("div:first");
				obj.css("background","blue")
			})
			//btn2事件  选择数组中最后一个div
			$("#btn2").click(function(){
				var obj=$("div:last");
				obj.css("background","orange")
			})
			//btn3事件  选择下标=3的div
			$("#btn3").click(function(){
				//等于指定下标的
				var obj=$("div:eq(3)");
				obj.css("background","yellow")
			})
			//btn4事件  选择<3下标的div
			$("#btn4").click(function(){
				//等于指定下标的
				var obj=$("div:lt(3)");
				obj.css("background","pink")
			})
			//btn5事件  选择<3下标的div
			$("#btn5").click(function(){
				//等于指定下标的
				var obj=$("div:gt(3)");
				obj.css("background","green")
			})
		})

	</script>
</head>
<body>
	<div id="one">我是div-0	</div>
	<div id="two">我是div-1	</div>
	<div >
		我是div-2
		<div>我是div-3</div>
		<div>我是div-4</div>
	</div>
	<div>我是div-5</div>
	<br/>
	<br/>
	<span>我是span</span><br/>
	<input id="btn" type="button" value="绑定事件"  /><br/>
	<input id="btn1" type="button" value="获取数组中第一个dom成员"  /><br/>
	<input id="btn2" type="button" value="选择数组中最后一个div"  /><br/>
	<input id="btn3" type="button" value="选择下标=3的div"  /><br/>
	<input id="btn4" type="button" value="选择<3下标的div"  /><br/>
	<input id="btn5" type="button" value="选择>3的div"  /><br/>
	

	</body>
	···

复制代码可直接运行

月亮困了r

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
jQuery--过滤器【基本过滤器语法使用】详细代码及注释

过滤器过滤器是一个字符串，用了筛选dom对象的，过滤器是和选择器一起使用的，在选择了dom对象后，在进行过滤筛选。1---基本过滤器：使用dom对象在数组中的位置，作为过滤条件。1)：选择数组中第一个dom成员语法：$("选择器：first")2)：选择数组中最后一个成员语法：$("选择器：last")3)：选择等于下标的dom成员语法：$("选择器：eq(下标)")4)：选择大于某个下标的所有成员语法：$("选择器：gt(下标)")5)：选择小于某个下标的所有成员语法：$("
复制链接

扫一扫