1、childNodes:获取节点,不同浏览器表现不同;
  IE:只获取元素节点;
  非IE:获取元素节点与文本节点;
  解决方案:if(childNode.nodeName=="#text") continue 或者 if(childNode.nodeType != '3') continue

2、children:获取元素节点,浏览器表现相同。
因此建议使用children。

childNodes返回的是节点的子节点集合,包括元素节点、文本节点还有属性节点。
children返回的只是节点的元素节点集合,所以返回的只有span元素。

3、firstChild与firstElementChild
  相同点:获取父节点下的第一个节点对象;
  不同点:1、firstchild:IE6,7,8:第一个元素节点;
      非IE6,7,8:第一个节点,文本节点或者元素节点;
      2、firstElementChild:IE6,7,8:不支持;
          非IE6,7,8:第一个元素节点;
function firstChild(obj){
if(obj.firstElementChild) return obj.firstElementChild;
return obj.firstChild
}
4、lastChild与lastElementChild
  相同点:获取父节点下的最后一个节点对象;
  不同点:1、lastchild:IE6,7,8:最后一个元素节点;
     非IE6,7,8:最后一个节点,文本节点或者元素节点;
     2、lastElementChild:IE6,7,8:不支持;
     非IE6,7,8:最后一个元素节点;

5、nextSibling与nextElementSibling
  相同点:获取后一个兄弟节点对象;
  不同点:1、nextSibling:IE6,7,8:后一个兄弟元素节点;
      非IE6,7,8:后一个兄弟节点,文本节点或者元素节点;
      2、lastElementChild:IE6,7,8:不支持;
      非IE6,7,8:后一个兄弟元素节点;

6、previousSibling与previousElementSibling
  相同点:获取前一个兄弟节点对象;
  不同点:1、previousSibling:IE6,7,8:前一个兄弟元素节点;
      非IE6,7,8:前一个兄弟节点,文本节点或者元素节点;
      2、previousElementChild:IE6,7,8:不支持;
      非IE6,7,8:前一个兄弟元素节点;

7、parentNode:获取父元素,不存在兼容性问题。

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元素的子元素,父元素,兄弟元素小记

    原生jsvar a = document.getElementById("dom"); del_space(a); //清理空格 var b = a.childNodes; //获 ...

  5. [原]js获取dom元素的实际位置及相对坐标

    关键API: Element.getBoundingClientRect() mdn:https://developer.mozilla.org/en-US/docs/Web/API/Element/ ...

  6. js | javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  7. Vue自定义指令获取DOM元素

    我们知道,Vue.js的核心是数据驱动,当数据有所变化时,DOM就会被更新,比如: <span v-text="msg"></span> export de ...

  8. vue(4)—— vue的过滤器,监听属性,生命周期函数,获取DOM元素

    过滤器 vue允许自定义过滤器,我个人认为,过滤器有两种,一种是对数据的清洗过滤,一种是对数据切换的动画过滤 数据切换的动画过滤 这里还是利用前面的动态组件的例子: 这里由于没办法展示动画效果,代码如 ...

  9. document.getElementById 和 document.getElementsByClassName获取DOM元素的区别

    想必小伙伴们对于 JS 获取DOM的几种方法早已烂熟于心,了然于胸,   尤其是 document.getElementById 和 document.getElementsByClassName, ...

随机推荐

  1. Ubuntu 16.04 源码编译安装PHP7

    一.下载PHP7的最新版源码 php7.0.9  下载地址 http://php.net/get/php-7.0.9.tar.gz/from/a/mirror 二.解压 tar -zxf /tmp/p ...

  2. Spring读书笔记——bean加载

    我们的日常开发几乎离不开Spring,他为我们的开发带来了很大的便捷,那么Spring框架是如何做到方便他人的呢.今天就来说说bean如何被加载加载. 我们在xml文件中写过太多类似这样的bean声明 ...

  3. 电脑IP地址被占用如何释放?

    回车后,关机,等待5分钟左右再开机,就释放掉了.

  4. Python自学笔记-with详解

    with的作用: with关键字是一个替你管理实现上下文协议对象的东西,适用于对资源进行访问的场合,确保不管使用过程中是否发生异常都会执行必要的"清理"操作,释放资源,比如文件使用 ...

  5. WebService文件上传相关配置(404.13、超出限制、超时)

    最近在做文件上传的功能,遇到一些问题,记录如下,以备以后使用. 1.HTTP Error 404.13 - Not Found,请求筛选模块被配置为拒绝超过请求内容长度的请求. IIS默认允许请求长度 ...

  6. python3.6如何安装pymssql

    使用pip install pymssql安装时,总是会出现UnicodeDecodeError.于是下载了适用的pymssql.whl进行安装,详细可参考 https://docs.microsof ...

  7. ABAP 数值四舍五入函数

    VALUE '12.5445' , dat1 . VALUE '12.540'. * 方法一 CALL FUNCTION 'HR_NZ_ROUNDING_DECIMALS' EXPORTING val ...

  8. spring cloud+dotnet core搭建微服务架构:配置中心续(五)

    前言 上一章最后讲了,更新配置以后需要重启客户端才能生效,这在实际的场景中是不可取的.由于目前Steeltoe配置的重载只能由客户端发起,没有实现处理程序侦听服务器更改事件,所以还没办法实现彻底实现这 ...

  9. RT-thread 利用Scons 工具编译提示python编码错误解决办法

    错误信息: scons: Reading SConscript files ...UnicodeDecodeError: 'ascii' codec can't decode byte 0xbd in ...

  10. 见到过的MOS管的一些参数

    选择MOS管的时候需要注意的几个参数1,VDSS(击穿电压):此电压要选择合适,一般是加入的电压值的峰值的两倍.2,VGS(th)(开启电压):3,RDS(on)(漏源电阻):这个值要尽可能的小,因为 ...