JQUERY3 文档处理

最新推荐文章于 2024-07-15 11:27:32 发布

Liartq

最新推荐文章于 2024-07-15 11:27:32 发布

阅读量129

点赞数

文章标签： jquery

本文链接：https://blog.csdn.net/Liartq/article/details/123601297

版权

本文档详细介绍了JQUERY3中用于筛选和查找的API，包括first(), last(), eq(), filter(), has(), not()等过滤方法，以及children(), find(), parent(), prevAll(), nextAll(), siblings()等查找方法，结合实例代码展示了如何在实际操作中应用这些功能。" 125255366,2013247,OpenCV高级形态学：morphologyEx函数详解与应用,"['计算机视觉', 'opencv', '图像处理', '形态学']

摘要由CSDN通过智能技术生成

1.筛选（过滤&查找）
过滤
查看官方API文档
first()：获取匹配的第一个元素
last()：获得匹配的最后一个元素
eq(N)：获取匹配的第N或-N个元素
filter(selector)：筛选出与指定表达式匹配的元素集合
has(selector)：筛选出包含特定特点的元素的集合


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<!-- 引入外部js -->
		<script src="js/jquery-3.6.0.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function() {
				/* 一、 在jQuery对象数组中，筛选出一部分元素 */

				//1.1 过滤
				// first
				// last
				// eq
				// filter
				// has
				// not
				//--过滤出指定表达式匹配的元素
				// 获取ul中所有的li元素，然后找到第一个元素
				// $("ul>li").first().css("background","red");
				// $("ul>li:first").css("background","yellow");
				// $("ul>li:eq(0)").css("background","yellow");
				// $("ul>li:lt(1)").css("background","yellow");

				// 找到最后一个元素
				// $("ul>li").last().css("background","red");

				// 找到指定的某一个元素，例如第3个
				// $("ul>li").eq(2).css("background","pink")

				//--过滤出指定表达式匹配的元素集合
				// 找到属性title为a的元素
				// $("ul>li").filter("[title=a]").css("background","green")

				// 筛选出有title属性的元素集合
				// $("ul>li").filter("[title]").css("background","green");
				
				// 筛选除有title属性或者title属性不等于b的元素集合
				// $("ul>li").filter("[title][title=a]").css("background","orange");
				
				// 筛选出有<span>标签的元素集合  has
				// $("ul>li").has("span").css("background","pink")

				// 筛选出没有title属性的元素集合
				// $("ul>li").not("[title]").css("background","black");


				//1.2 查找

				// 查找ul的所有子标签,并且指定为li子标签
				// $("ul").children().css("color","red");
				
				// $("ul").children("li").first().css("color","red");
				// $("ul").children("li").eq(3).css("color","red");
				
				// 通过下标 返回的是js对象
				// console.log($("ul").children("li")[2])
				// $($("ul").children("li")[2]).css("background","red"