原生js
var a = document.getElementById("dom");
del_space(a); //清理空格
var b = a.childNodes; //获取a的全部子节点;
var c = a.parentNode; //获取a的父节点;
var d = a.nextSibling; //获取a的下一个兄弟节点
var e = a.previousSibling; //获取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").

转自https://lvwenhan.com/many/373.html

js获取dom元素的子元素,父元素,兄弟元素小记的更多相关文章

  1. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  2. 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题

    1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...

  3. JS获取DOM元素的八种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  4. 原生JS获取DOM 节点到浏览器顶部的距离或者左侧的距离

    关于js获取dom 节点到浏览器顶/左部的距离,Jquery里面有封装好的offset().top/offset().left,只到父级的顶/左部距离position().top/position() ...

  5. line-height系列(二)——对行内元素(文字、图片、兄弟元素)、块级元素设置line-height后的表现

    >原创文章,转载请注明来源! 二.对行内元素(文字.图片.兄弟元素).块级元素设置line-height后的表现 对块级元素无效,对行内元素有效.可继承给行内元素. 文字的line-height ...

  6. Vue-组件传值:子传父和兄弟组件间常见的传值方式

    前言 上篇介绍了我对vue组件化的理解和父组件对子组件传值的方式,这篇介绍下常见的子传父和兄弟组件间的传值方式 目录 子组件向父组件传值 任意组件间的传值方式 正文 子组件向父组件传值 关键知识点:$ ...

  7. JS获取DOM元素

    1.childNodes:获取节点,不同浏览器表现不同: IE:只获取元素节点: 非IE:获取元素节点与文本节点: 解决方案:if(childNode.nodeName=="#text&qu ...

  8. js 获取DOM的style属性

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. js获取dom对象style样式的值

    js获取到的dom对象的style通常是没有值得,因为我们都写在外部文件中,从慕课网上见到讲师封装的一个方法,挺不错.特此记录下来. function getStyle(obj,attr){ if(o ...

随机推荐

  1. 计算fibonacci数(多种方法)

    #include <iostream> using namespace std; //计算fibonacci数 //方法一:二分递归法,时间复杂度为O(2^n),额外空间复杂度为常数 in ...

  2. 在小程序中修改上一个页面里data中的数据调用上一个页面的方法

    //获取已经打开的页面的数组 var pages = getCurrentPages(); //获取上一个页面的所有的方法和data中的数据  var lastpage = pages[pages.l ...

  3. Ubuntu-18.04下安装mysql

    安装mysql服务器 1. sudo apt-get install mysql-server 2. sudo apt-get install mysql-client 登录问题 安装成功后,我们会发 ...

  4. 电话面试问答Top 50 --[伯乐在线]

    今年是2015年,在过去几年中,电面(电话面试)是筛选程序员职位候选人的最流行的方式.它让雇佣双方很容易互相了解对方,候选人不需要去未来雇主的所在地,面试官也不用做额外的安排.这是我介绍程序员面试问题 ...

  5. Sqlserver 游标&存储过程&临时表混合使用实例

    通过嵌套,根据表中记录的表名与列名到指定位置取值. --声明存储过程 ProPIMS if (exists (select * from sys.objects where name = 'ProPI ...

  6. CAShapeLayer的使用[2]

    CAShapeLayer的使用[2] CAShapeLayer支持的动画类型有如下这些. ------------------------------------------------------- ...

  7. Linux ping命令详解

    Linux系统的ping命令是常用的网络命令,它通常用来测试与目标主机的连通性 基于IMCP协议 常见命令参数 -q 不显示任何传送封包的信息,只显示最后的结果 -n 只输出数值 -R 记录路由过程 ...

  8. 使用UEFI+GPT模式安装Windows

    一.硬盘分区 分区还是用PE下最常用的DiskGenius,可直接使用"快速分区"功能对硬盘进行分区.分区表类型选择GUID,勾选建立ESP分区.ESP分区非常重要,用于存放系统引 ...

  9. [attribute |= value] 与 [attribute ^= value],[attribute ~= value] 与 [attribute *= value] 的联系与区别

    [attribute |= value] 与 [attribute ^= value] 的联系与区别: 一.联系: 1. 两个选择器的 attribute 属性值等于 value 时都可以匹配 < ...

  10. canvas图形库

    总结了一些canvas绘制2d图形的方法,记录在博客中,以便需要的同学参考,也便于日后加深记忆. 1. 圆角矩形: 如上图:w表示矩形的宽,h表示矩形的高,r表示矩形圆角的半径.整个矩形在画布中,(0 ...