原生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. 实用爬虫-01-检测爬虫的 IP

    实用爬虫-01-检测爬虫的 IP 本篇介绍一个识别爬虫 ip 的小实例(教你一招识破无效的 ip 代理) [注意事项]: 1.url 可能会失效(个人感觉,因为它带了一个2018,下面附上链接获取方法 ...

  2. 谁动了我的Mac ??

    教大家一种方法,看看有没有人在自己对Mac睡眠后对其进行唤醒 一:应用程序里有个控制台,可以将这个打开,输入wake reason 二:在终端输入:syslog |grep -i "Wake ...

  3. python 装饰器的详细理解【多次实验】

    demo: # 装饰器其实就是对闭包的使用 print('haha嘻嘻') def hot(): print('知道') def dec(fun): print("call dec" ...

  4. Ionic控件之——按钮(Button)

    Ionic提供丰富的按钮特性,足以满足大部分的按钮实现需求. 一.HTML实现一个简单按钮: <button class="button"> 我是按钮 </but ...

  5. 使用TFHpple解析html

    使用TFHpple解析html https://github.com/topfunky/hpple 前期准备工作 引入静态库文件 添加库文件的 header search paths(注意,必须选中 ...

  6. ORACLE 数据找回

    -- 找回一个小时前的数据 select * from sys_system_dictionary as of timestamp sysdate - 1/24order by id AS OF TI ...

  7. Linxu下 expect的实用实例_1

    案例 例1:从本机自动登录到远程机器192.168.1.200(端口是22,密码是:PASSWORD)登录到远程机器后做以下几个操作:1)useradd wangshibo2)mkdir /opt/t ...

  8. 整合VIM和Graphviz,并且使用本办法实现实时预览

    在编程或是整理知识的时候一直苦于没有一款可以帮助理清思路的工具. 在网上苦寻良久,终于找到了一款可心可意的小软件 —— Graphviz. 折腾了一番,终于可以凑合着用了. 现将折腾的成果记录于此以作 ...

  9. 激活老电脑的第二春:内存盘为Chrome浏览器做缓存

    AMD Radeon RAMDisk 4.2.1 正式版 下载地址:http://dl.pconline.com.cn/html_2/1/73/id=7204&pn=0.html 适用于:wi ...

  10. linux man指令问题

    linux man指令问题 2010-1-13 13:33 提问者: 钟离伊轩 man命令执行时,可加入数值,来限制帮助级别. 这句话对不对啊???? 我记得man page是分章节的..好像可以加数 ...