JQuery遍历-学习笔记

最新推荐文章于 2022-11-18 19:38:06 发布
最新推荐文章于 2022-11-18 19:38:06 发布
阅读量135 收藏
点赞数
分类专栏： JQuery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41700374/article/details/86679295
版权

JQuery遍历-祖先：

  • parent()方法返回被选元素的直接父元素；
  • parents()方法返回被选元素的所有祖先元素(包括<html>)；
  • parentUntil()方法返回介于2个给定元素之间的所有祖先元素。
<div style="width: 200px; height: 200px; background-color: red;">
			<p style="width: 50px; height: 50px; background-color: yellow;">
				<span style="width: 25px; height: 25px; background-color: blue;">
					wzy
				</span>
			</p>
		</div>

例如：$("span").parent()返回的是p元素，$("span").parents()返回的是p和div元素，$("span").parentsUntil("div")返回的是p元素。

JQuery遍历-后代：

  • children()方法返回被选元素的所有直接子元素；
  • find()方法返回被选元素的后代元素。

返回每个<div>元素的所有子元素：$("div").children().

返回类名为"1"的所有<p>元素，并且它们是<div>的直接子元素：$("div").children("p.1").

返回属于<div>后代的所有<span>元素：$("div").find("span").

返回<div>所有后代：$("div").find("*").

Tong XU
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jquery遍历多个li_JQuery中使用.each()遍历元素学习笔记
weixin_39621794的博客
12-19 1026
今天写一个选项卡的时候，需要用到jquery中的.each(),通过获取each()中的index参数来获取li元素的编号，方便下面区块显示，在一个测试页面上写好了下面的代码：tab选项卡ul,li{list-style: none;margin: 0px; padding: 0px;}li{float: left;width: 80px; height: 30px; background-col...
JQuery中使用.each()遍历元素学习笔记
10-25
在jQuery中，`.each()`函数是一个非常重要的方法，它用于遍历数组或对象，执行针对每个元素的操作。在这个实例中，我们看到`.each()`被用来处理`<li>`元素，以实现一个选项卡功能。接下来，我们将深入探讨`.each()`...
Cypress UI 自动化（9）- 巧用辅助定位函数.children()\.first()等
兔纸先森的后花园
08-05 1159
.children(selector) 定义：children() 方法返回被选元素的所有直接子元素。（嵌套包含） 参数 描述 selector 字符串值，包含匹配元素的选择器表达式。 示例： cy.$("div").children(".selected") .first() 定义：first() 将匹配元素集合缩减为集合中的第一个元素。 示例： cy.$("div").first() .last() 定义：first() 将匹配元素集合缩减为集合..
jquery基础--学习笔记
可达鸭的博客
11-18 387
jquery基础--学习笔记
jQuery遍历----------(遍历、祖先、后代、同胞、过滤)
WEL测试
04-18 1489
关于jQuery学习笔记的参考网站是：http://www.runoob.com/jquery/jquery-tutorial.html jQuery 遍历 jQuery 遍历，以某项选择开始，并沿着这个选择移动，直到抵达期望的元素为止。 下图展示了一个家族树。通过 jQuery 遍历，能够从被选（当前的）元素开始，轻松地在家族树中向上移动（祖先），向下移动（子孙），水平
JQuery基础--学习笔记
m0_60679171的博客
04-24 804
个人的JQuery学习笔记
jQuery杂谈-学习笔记
月吖吖
04-23 111
1.jQuery对象 jQuery包装集对象 获得mydiv的Jquery对象： var divJquery = $("#mydiv"); 2.基础选择器 1、ID选择器 格式：$("#id属性值") 获取指定id值的对象(只会获取到第一个id的值) 2、类选择器 格式：$(".class属性值") 获取所有指定class属性值的元素 3、元素选择器 格式：$("元素名/标签名") ...
jquery学习笔记--遍历
zyp的博客
09-16 128
遍历：用于根据其相对于其他元素的关系来"查找"（或选取）HTML 元素。以某项选择开始，并沿着这个选择移动，直到抵达您期望的元素为止。 $("document").ready(function () { // 返回指定元素的父元素 $("#parent").click(function () { $("span").parent().css({ "color": "red.
JQuery-学习笔记05【高级——JQuery动画和遍历】
upward
02-19 448
JQuery-学习笔记05【高级——JQuery动画和遍历】
jQuery学习笔记（四）jQuery遍历、DOM操作
一叶知秋
09-26 4170
一、DOM操作（增删改查） 1、新增节点 $(selector).append(content) 在匹配元素内部最后面新增一个节点 $(content).appendTo(selector) 把新节点追加到匹配元素内部最后面（效果同append，只是书写上前后位置互换） $(selector).prepend(content) 在匹配元素内部最前面新增一个节点 $(conten...
Jquery学习笔记分享
11-24
**jQuery学习笔记分享** 在Web开发中，jQuery是一个非常重要的JavaScript库，它简化了HTML文档遍历、事件处理、动画以及Ajax交互等任务。本文将深入探讨jQuery的基本概念、核心功能以及常见用法。 ### 第1章：...
jQuery：jQuery相关-学习代码和笔记
02-08
**jQuery：jQuery相关-学习代码和笔记** jQuery是一款强大的JavaScript库，它简化了HTML文档遍历、事件处理、动画制作和Ajax交互等任务。自2006年发布以来，jQuery已经成为前端开发中最广泛使用的库之一，极大地...
Jquery 基础学习笔记
10-29
本篇笔记主要介绍了JQuery的基础用法，对于初学者来说是非常实用的学习资料。 1. **属性操作**：`attr()` 方法允许我们设置或获取元素的属性。例如，`$("input").attr("class","btn")` 会将所有`<input>`元素的`...
JQuery之隐藏hide()方法和显示show()方法
qq_41700374的博客
11-11 9484
jQuery hide() 和 show() 通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素。 其语法形式为： $(selector).hide(speed,callback); $(selector).show(speed,callback); 可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒...
JQuery中$("ul li:first")和$("ul li:first-child")的区别
qq_41700374的博客
11-11 4414
&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;菜鸟教程&lt;/title&gt; &lt;script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.j
$("tr:even")和$("tr:odd")
qq_41700374的博客
11-11 1985
$("tr:even")：选取偶数位置的 &lt;tr&gt; 元素，注意下标从0开始； $("tr:odd")：选取奇数位置的&lt;tr&gt;元素，注意下标从0开始。 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &am
JQuery-获取内容和属性
qq_41700374的博客
10-07 279
获得内容-text()，html()以及val() a. text()：设置或返回所选元素的文本内容； b. html()：设置或返回所选元素的内容（包括HTML标记）； c. val()：设置或返回表单字段的值； 获取属性-attr() attr()方法用于获取或修改属性值 <!DOCTYPE html> <html> <head> <...
常用的JQuery事件方法
qq_41700374的博客
11-11 176
click()方法：该函数在用户点击 HTML 元素时执行。 dblclick()方法：当双击元素时，会发生 dblclick 事件。 mouseenter()方法：当鼠标指针穿过元素时，会发生 mouseenter 事件。 mouseleave()方法：当鼠标指针离开元素时，会发生 mouseleave 事件。 mousedown()方法：当鼠标指针移动到元素上方，并按下鼠标按键时，会发...
使用jquery 遍历函数-find()、eq()
最新发布
05-18
find()和eq()是jQuery中常用的遍历函数。 find(selector)函数可以在当前元素的子孙元素中查找符合指定选择器的元素，并将它们作为一个新的jQuery对象返回。例如： ```javascript // 查找id为parent的元素下所有...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值