JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法


Posted in Javascript onJune 05, 2016

最近工作中总遇到取各种父啊子啊兄弟姐妹啊,每次都得查,这次整理个全乎的~

先给大家上干货:

【js的获取方式】

<div id = "dom">
          <div></div> 
          <div></div> 
     <div></div> 
 </div>
 function dom(){
   var a = document.getElementByIdx_x_x("dom");
   var b = a.childNodes;   获取a的全部子节点
   var c = a.parentNode;   获取a的父节点
   var d = a.nextSbiling;   获取a的下一个兄弟节点
   var e = a.previousSbiling;获取a的上一个兄弟节点
   var f = a.firstChild;    获取a的第一个子节点
   var g = a.lastChild;     获取a的最后一个子节点
}

【jQuery的获取方式】

jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class")
jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素
jQuery.children(expr).返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点
jQuery.contents(),返回下面的所有内容,包括节点和文本。这个方法和children()的区别就在于,包括空白文本,也会被作为一个
jQuery对象返回,children()则只会返回节点
jQuery.prev(),  返回上一个兄弟节点,不是所有的兄弟节点
jQuery.prevAll(),返回所有之前的兄弟节点
jQuery.next(),   返回下一个兄弟节点,不是所有的兄弟节点
jQuery.nextAll(),返回所有之后的兄弟节点
jQuery.siblings(), 返回兄弟姐妹节点,不分前后
jQuery.find(expr),跟jQuery.filter(expr)完全不一样。jQuery.filter()是从初始的jQuery对象集合中筛选出一部分,而jQuery.find()的返回结果,不会有初始集合中的内容,比如$("p"),find("span"),是从p元素开始找,等同于$("p span")
Javascript 相关文章推荐
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
Aug 14 Javascript
javascript this用法小结
Dec 19 Javascript
完美解决AJAX跨域问题
Nov 01 Javascript
深入浅析AngularJS和DataModel
Feb 16 Javascript
jQuery 全选 全不选 事件绑定的实现代码
Jan 23 Javascript
浅谈MUI框架中加载外部网页或服务器数据的方法
Jan 31 Javascript
jQuery实现为动态添加的元素绑定事件实例分析
Sep 07 jQuery
详解关于Angular4 ng-zorro使用过程中遇到的问题
Dec 05 Javascript
解决layui的input独占一行的问题
Sep 10 Javascript
对layui中table组件工具栏的使用详解
Sep 19 Javascript
electron 安装,调试,打包的具体使用
Nov 06 Javascript
uniapp开发打包多端应用完整方法指南
Dec 24 Javascript
分享javascript实现的冒泡排序代码并优化
Jun 05 #Javascript
EasyUI布局 高度自适应
Jun 04 #Javascript
javascript获取select标签选中的值
Jun 04 #Javascript
jQuery Mobile 触摸事件实例
Jun 04 #Javascript
jQueryUI DatePicker 添加时分秒
Jun 04 #Javascript
设置jQueryUI DatePicker默认语言为中文
Jun 04 #Javascript
javacript获取当前屏幕大小
Jun 04 #Javascript
You might like
检测png图片是否完整的php代码
2010/09/06 PHP
如何用phpmyadmin设置mysql数据库用户的权限
2012/01/09 PHP
php FLEA中二叉树数组的遍历输出
2012/09/26 PHP
解析PHP实现多进程并行执行脚本
2013/06/18 PHP
PHP中CURL的CURLOPT_POSTFIELDS参数使用细节
2014/03/17 PHP
PHP提示Deprecated: mysql_connect(): The mysql extension is deprecated的解决方法
2014/08/28 PHP
php过滤表单提交的html等危险代码
2014/11/03 PHP
js原生appendChild的bug解决心得分享
2013/07/01 Javascript
jquery easyui combox一些实用的小方法
2013/12/25 Javascript
jQuery+slidereveal实现的面板滑动侧边展出效果
2015/03/14 Javascript
javascript图片滑动效果实现
2021/01/28 Javascript
js重写方法的简单实现
2016/07/10 Javascript
基于JavaScript实现的希尔排序算法分析
2017/04/14 Javascript
vue实现配置全局访问路径头(axios)
2019/11/01 Javascript
js实现超级玛丽小游戏
2020/03/18 Javascript
Postman如何实现参数化执行及断言处理
2020/07/28 Javascript
JavaScript函数柯里化实现原理及过程
2020/12/02 Javascript
python简单分割文件的方法
2015/07/30 Python
django基于存储在前端的token用户认证解析
2019/08/06 Python
Numpy 中的矩阵求逆实例
2019/08/26 Python
Python操作Mongodb数据库的方法小结
2019/09/10 Python
Django 框架模型操作入门教程
2019/11/05 Python
Python小整数对象池和字符串intern实例解析
2020/03/21 Python
Django Form设置文本框为readonly操作
2020/07/03 Python
python 获取谷歌浏览器保存的密码
2021/01/06 Python
英国高档时尚男装购物网站:MR PORTER
2016/08/09 全球购物
宝拉珍选英国官网:Paula’s Choice英国
2019/05/29 全球购物
电脑饰品店的创业计划书
2014/01/21 职场文书
捐助倡议书范文
2014/04/15 职场文书
大学生社团活动总结
2014/04/26 职场文书
会计系毕业生求职信
2014/05/28 职场文书
邀请函样本
2015/02/02 职场文书
2015年化验员工作总结
2015/04/10 职场文书
电影焦裕禄观后感
2015/06/09 职场文书
演讲稿:态度决定一切
2019/04/02 职场文书
python引入其他文件夹下的py文件具体方法
2021/05/23 Python