失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > jQuery获取父元素节点 子元素节点及兄弟元素节点办法【jquery】

jQuery获取父元素节点 子元素节点及兄弟元素节点办法【jquery】

时间:2023-03-29 07:24:28

相关推荐

jQuery获取父元素节点 子元素节点及兄弟元素节点办法【jquery】

web前端|js教程

jQuery,父元素节点,子元素节点,兄弟元素节点

web前端-js教程

经费管理系统源码,vscode调试无法输出,ubuntu 目录 分区,tomcat6 缓存,爬虫不会,php判断数组是否包含,曲靖seo培训有哪些,价值 网站源码,微信公众号源代码模板lzw

先来看这段html代码,整个取节点(父、子、兄弟等)的方法都是围绕这段代码来的:

数据交易网站源码,vscode格式化编码,ubuntu不认鼠标,tomcat的安装用户,爬虫403解封,pear php库,吴川seo优化排名系统,网站源码完整复制工具,大型手机网站模板lzw

条目一

第一项第二项

JQUERY 父节点的获取:

sql客户端源码,ubuntu开发环境设置,tomcat 中文名下载,爬虫携程数据,php时间转化为时间戳,青山seo收费lzw

jquery获取父元素方法比较多、比如parent()、parents()、closest()、find,first-child这些都能帮你实现查找父节点、子节点、兄弟节点

如我们利用parent()来获取父节点

$("#dwtedx").parent().parent();//取得id为firstli的li节点$("#dwtedx").parent().parent(".par");//取得最上面的ul节点$("#dwtedx").parent(".par");//取得向上第一层的ul节点 以上是通过parent的方式来获取父节点的、大家可以根据自己项目需要来选择方法哈

下面、我们主要来讲一下 parents() 和 closest() 两个方法的区别

1、closest从当前元素开始匹配寻找、parents从父元素开始匹配寻找

2、closest逐级向上查找、直到发现匹配的元素后 就停止了、parents一直向上查找直到根元素、然后把这些元素放进一个临时集合中、再用给定的选择器表达式去过滤

3、closest返回0或1个元素、parents可能包含0 个、1个、或者多个元素

代码可以这样写:

$(#dwtedx).parents(.par);//可以找出所有class为.par的节点$(#dwtedx).closest(.par); //可以找出一个父节点、就是上面一层的那个

JQUERY 兄弟节点的获取

jQuery兄弟节点获取、我们的思路是通过当前节点找到父节点、然后通过父节点去找到子节点、代码如下

$(".title").parent().find(ul);//找到自己的兄弟节点ul 就是通过先找到 h3 与 ul 共同的父节点 li 然后来用 find() 找到 ul

还有一种方法是使用 siblings() 函数、代码如下

$(".title").siblings(ul);//找到自己的兄弟节点ul

JQUERY 子节点的获取

匹配第一个子元素 :first 只匹配一个元素、而此选择符将为每个父元素匹配一个子元素

$(".par:first-child");//取得id为firstli的节点

通过选择器去获取、代码如下:

$(#firstli h3.title);//取得条目一的h3

使用find()函数、上面已经说过了、用法一样

$("#firstli").find("h3");//找到子兄弟节点h3

使用children()函数、代码如下

$("#firstli").children("h3.title");//取得子节点h3、class为title

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

如果觉得《jQuery获取父元素节点 子元素节点及兄弟元素节点办法【jquery】》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。