首页 前端知识 jQuery获取父节点、子节点、兄弟节点

jQuery获取父节点、子节点、兄弟节点

2024-05-12 00:05:35 前端知识 前端哥 53 932 我要收藏

介绍

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(框架)于2006年1月由John Resig发布。

jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的CSS选择器,并且可对CSS选择器进行扩展。

现状

jQuery目前已经趋于下滑,随着各大浏览器趋于标准化,浏览器兼容问题已经越来越不是问题了。随着MVVM(Vue、React…)框架的普及,项目不再会大量直接操作DOM(虚拟DOM)。

不过,它的学习门槛低,学习成本也比较低,前端还是建议学一下。

功能

  • HTML 元素选取
  • HTML 元素操作
  • CSS 操作
  • HTML 事件函数
  • JavaScript 特效和动画
  • HTML DOM 遍历和修改
  • AJAX
  • Utilities

提示:  除此之外,jQuery 还提供了大量的插件。

节点查找

jQuery的父节点查找方法

$(selector).parent(selector):获取父节点

$(selector).parentNode:以node[]的形式存放父节点,如果没有父节点,则返回空数组

$(selector).parents(selector):获取祖先元素

jQuery的兄弟节点查找方法

$(selector).prev():返回被选元素的前一个同级元素

$(selector).previousSibling():获取上一个兄弟节点

$(selector).prevAll():获取之前所用的兄弟节点

$(selector).next() :获取被选元素的后一个同级元素

$(selector).nextSibling():获取下一个兄弟节点

$(selector).nextAll():获取之后所有的兄弟节点

$(selector).siblings():获取所有的兄弟节点

jQuery的子节点查找方法

$(selector).children():获取所有直接子节点

$(selector).childNodes():以node[]的形式存放子节点,如果没有子节点,则返回空数组

$(selector).firstChild():获取第一个子节点

$(selector).lastChild():获取最后一个子节点

$(selector).contents():获取包含的所有内容,包括空文本

$(selector).removeChild(selector):删除并返回指定的子节点

$(selector).replaceChild(selector):替换并返回指定的子节点

转载请注明出处或者链接地址:https://www.qianduange.cn//article/8231.html
标签
评论
发布的文章

JSON三种数据解析方法

2024-05-22 09:05:13

使用nvm管理(切换)node版本

2024-05-22 09:05:48

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!