位置: 编程技术 - 正文

jQuery遍历DOM元素与节点方法详解(jquery遍历div子元素)

编辑:rootadmin

推荐整理分享jQuery遍历DOM元素与节点方法详解(jquery遍历div子元素),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery中有哪些方法可以遍历节点?,jquery遍历div子元素,jquery遍历表单元素,jquery如何遍历数组,jquery遍历div,jquery 遍历,jquery遍历div,jquery遍历div,内容如对您有帮助,希望把文章链接给更多的朋友!

本文实例讲述了jQuery遍历DOM元素与节点方法。分享给大家供大家参考,具体如下:

一、向上遍历--祖先元素

① $(selector).parent([filter]):返回selector匹配元素的直接父元素,方法可以接受一个过滤selector来过滤返回的父元素。

② $(selector).parents([filter]):返回匹配元素的所有祖先节点,一直向上直到文档根元素html,方法可以接受一个过滤selector来过滤返回的祖先节点。

备注:parent与parents的区别,parent返回直接父节点,parents返回所有的祖先节点,另外$("html").parent()返回document节点,而$("html").parents()则返回空。

③ $(selector).parentUntil([ancestorSelector][,filter]):返回匹配节点与ancestorSelector之间的所有祖先节点,注意不包括ancestorSelector匹配的几点,方法可以接受一个过滤selector来过滤返回的祖先节点,如果ancestorSelector为空或者在其祖先节点中没有找到匹配ancestorSelector的元素则返回所有祖先节点等同于parents()方法。

$(selector).parentUtil(element[,ancestorSelector]):用法及含义同上。

④ $(selector).offsetParent():返回匹配元素的最近的一个定位的祖先元素,所谓定位祖先元素是指其CSS position属性设置为relative,absolute,fixed,主要在动画演示过程中计算元素的偏移及位置具有很大的作用。

⑤ $(selector).closest(ancestorSelector[,context]):获取最近的一个匹配ancestorSelector的祖先元素,方法可以接受一个参数context来控制搜索的范围。同parents方法有如下区别:

a.closest从来当前元素本身开始向上搜索parents则从父节点元素开始。

b.closest沿DOM树向上遍历,直到找到匹配ancestorSelector的一个元素位置parents沿DOM树向上遍历,直到文档的根元素为止,将每个祖先元素添加到一个临时集合;如果应用了选择器,则会基于该选择器对这个集合进行筛选

c.closest返回包含0个或者一个元素的jQuery对象parents返回包含0个、一个或多个元素的jQuery对象

其它变形用法:

二、向下遍历--子孙元素

① .children([childrenSelector]):返回元素的直接子元素,方法可以接受一个参数来过滤返回的子元素。

② .find(descendantSelector):返回元素的匹配decendantSelector的所有后代元素,一直向下知道最后一个后代。

其它变形用法:

③ .contents():返回元素的所有子元素,同children的区别是contents包含text节点及comment节点。

jQuery遍历DOM元素与节点方法详解(jquery遍历div子元素)

三、同级遍历--兄弟元素

① .siblings([selector]):返回当前元素的所有兄弟元素,方法可以接收一个可选参数来过滤返回的兄弟元素。

② .next([selector]):返回当前元素的下一个兄弟元素,方法可以接受一个可选参数来过滤返回的兄弟元素。

③ .nextAll([selector]):返回当前元素后面的所有兄弟元素,方法可以接受一个可选参数来过滤返回的兄弟元素。

④ .nextUntil([selector][,filter]):返回当前元素的所有兄弟元素直到遇到匹配selector条件的兄弟元素,方法可以接受一个可选参数filter来过滤返回的兄弟元素。

⑤ .prev/prevAll/prevUntil与next/nextAll/nextUntil用法相同,作用相近,只是搜索的方向相反。

四、过滤

① .filter(selector):从当前匹配的元素集合中筛选中符合selector条件的子集合,用的用来减少匹配的范围。

.filter(function(index)):根据回调函数来过滤当前匹配的元素集合,回调函数传入参数index是指元素在集合中的索引,在函数体内可用this来代表元素,函数返回true/false,如果返回true,则保留子元素,否则排除子元素。

其它变形用法:

② .first():返回当前匹配元素集合中的第一个元素。

③ .last():返回当前匹配元素集合中的最后一个元素。

④ .eq(index/-index):返回当前匹配元素集合指定位置的元素,索引从0开始,负数表示从尾到头的顺序进行排序。

⑤ .has(selector/element):从当前元素集合中返回具有特定子元素的元素集合,排除不具备对应子元素的元素。子元素可以用参数selector或者元素对象来进行匹配。

⑥ .is(selector|function(index)|element|jQueryObject):根据一个选择器或者回调函数或者元素或者jQuery对象来检验元素集合,如果其中至少包含一个符合给定表达式的元素则返回true,否则返回false,另外如果当前元素集合为空或者表达式为空,则返回false。这个方法一般用在回调函数中例如事件处理handler里面,来判断this是否为某个特定元素

⑦ .map(callback(index,domElement)):将当前匹配的元素数组通过回调函数返回值转化为另外一个对象数组(不管是否为dom元素),如果想转化普通jQueryObject数组可以使用jQuery.map(array,callback(objectOfArray,indexOfArray))方法来实现。

⑧ .not(selector|elements|function(index)|jQuery object):从当前匹配的元素数组中删除符合参数调节的元素,参数可以是selector、DOM element、普通的jQuery对象以及一个返回布尔变量的回调函数。

⑨ .slice(start[,end]):从当前匹配的元素集合中获取指定范围的一个子集,start及end如果为负数则获取元素方向从尾到头。

更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery遍历算法与技巧总结》、《jQuery表格(table)操作技巧汇总》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

jquery.cookie.js实现用户登录保存密码功能的方法 本文实例讲述了jquery.cookie.js实现用户登录保存密码功能的方法。分享给大家供大家参考,具体如下:需要导入的js有jquery.js和jquery.cookie.jsscripttype="text/ja

jQuery通过写入cookie实现更换网页背景的方法 本文实例讲述了jQuery通过写入cookie实现更换网页背景的方法。分享给大家供大家参考,具体如下:!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""

jQuery获取cookie值及删除cookie用法实例 本文实例讲述了jQuery获取cookie值及删除cookie用法。分享给大家供大家参考,具体如下:cookie在jquery中有指定的cookie操作类,这里先来介绍在使用cookie操

标签: jquery遍历div子元素

本文链接地址:https://www.jiuchutong.com/biancheng/384936.html 转载请保留说明!

上一篇:jQuery中的基本选择器用法学习教程(jquery中的基本选择器有哪些)

下一篇:jquery.cookie.js实现用户登录保存密码功能的方法

  • 研发辅助账科目设置
  • 未能确认收入的原因
  • 支付给个人的佣金费用需要发票吗
  • 所得税费用的余额期末时应转入利润分配账户
  • 法人存到公司账户的钱怎么记账
  • 电子发票红字发票怎么开
  • 行政事业单位收据样本
  • 货物已到发票未到怎么做账
  • 营改增医院增值税
  • 生产企业电梯维修方案
  • 运输费计入采购成本的分录
  • 无产权的建筑出售怎么办
  • 民间非营利组织会计制度
  • 借款利息资本化金额
  • 享受免税的企业每月直接零申报吗
  • 公司注销清算债权委托另一股东处理
  • 关于房屋租赁备案的通知
  • 如何免费获取Win11企业版
  • 一般纳税人出租其2016年4月30日前取得的不动产
  • 进口关税增值税计算公式
  • php入门基础教程
  • 默认网关不可用怎么修复
  • 高新企业研发费用会计分录
  • 固定资产汽车抵扣新政策
  • 在产品定额工时怎么算
  • 企业信用贷款还款方式
  • 增值税纳税人兼营免税减税项目的
  • yolo v1 pytorch源代码
  • vue自定义页面
  • Python图像识别实战(四):搭建卷积神经网络进行图像二分类(附源码和实现效果)
  • 猿创征文,新芯设计
  • 盘盈的存货账务怎么处理
  • 销货退回与折让属于什么科目
  • 物流小规模企业有哪些
  • 非限定性收入属于什么科目?
  • js正数转负数
  • 代收代缴水费收不上来怎么办
  • 定额发票验旧日期怎么算
  • 售后回租融资租赁会计处理
  • sqlserver创建维护计划
  • 哪些人需要税务会计
  • 固定资产接受捐赠的条件
  • 印花税减免税优惠政策2019
  • 什么是存货周转期间
  • 技术转让费如何计算
  • 工人晚上加班的说说心情
  • 长期股权投资成本法会计处理
  • 会计做账的凭据是什么
  • 初次申报出口退税可能会遇到哪些问题
  • 单式记账法因为其简单易学,记账效率高
  • 民间非营利组织包括哪些单位
  • 出口退税转免税怎么写个说明
  • 转账支票填写样本图片
  • 内部交易内部交易收益造成的当期折旧的多计额
  • 应收账款周转率计算公式
  • 编写sql需要注意什么
  • 自动启动win10
  • linux版的oracle
  • centos用户添加到组
  • xp系统进入桌面后没反应
  • schedul2.exe - schedul2是什么进程 有什么用
  • win10如何不升级系统
  • win10的用户
  • win8系统怎么设置无线网连接啊
  • WIN7系统中WQRD超链接打不开怎么办
  • web标准化
  • 链接符怎么删除
  • virtualbox no bootable medium
  • jQuery checkbox选中问题之prop与attr注意点分析
  • 深入理解中国式现代化
  • android线程间通信的几种方法
  • android接听电话
  • js网页背景色
  • linux0.11编译
  • 叠加计算公式
  • js设置点击效果
  • 交社保去地税局交吗
  • 长安cs752016款2.0手动
  • 税务筹划怎么样
  • 个人所得税的工资比实际的多
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设