关于节点的兼容性:

1:获取元素的子节点
 a: childNodes:获取元素的子节点,空文本,非空文本,注释,获取的比较全面,
         如果只是想获取元素的子节点,请用(children)

b:     children方法:可以获取元素的子节点,但是在(IE8中)除了可以获取子节点,还可以获取(注释节点) 一般情况下,          

          元素中不会有注释,但是如果有,可以使用(nodeType==8)来去除注释 节点

2:获取元素的父节点

   parentNode:获取元素的父节点,所有浏览器都支持,我喜欢

3:获取元素的下一个元素节点
   nextElementSibling:获取下一个兄弟节点,但是在ie8中,不支持这方法,需要兼容
         逻辑思路:ie8中支持nextSibling这个方法,nextSibling方法中也可以获取元素节点,

        只是获取的比较全面,可以单独把元素节点提取出来,达到兼容的目的

          

4:获取元素的上一个元素节点 

    previousElementSibling:同样的存在兼容问题

5:获取元素中的第一个子元素 

    firstElementChild:同样兼容性问题,在ie中使用(firstChild)方法,兼容封装代码,同上。

5:获取元素中的最后一个子元素     

    lastElementChild

:同样兼容性问题,在ie中使用(lastChild)方法,兼容封装代码,

6:克隆节点

 cloneNode:

如果小括号里面有参数,参数是true,表示深克隆: 能够克隆这个标签以及标签里面所有的内容。
如果小括号里面有参数,参数是false,表示浅克隆,只能克隆当前这个标签,不会克隆这个标签里面的内容。
如果小括号里面没有参数,默认是false。
 
7:追加子节点
appendChild:
克隆出来的标签只存在内存中,不会主动的追加到页面上

关于原生js的节点兼容性的更多相关文章

  1. 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较

    一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...

  2. 原生JS添加节点方法与jQuery添加节点方法的比较及总结

    一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div1</div> <div id="d ...

  3. 原生js方面的兼容性问题

    1.关于获取行外样式 currentStyle 和 getComputedStyle 出现的兼容性问题  我们都知道js通过style不可以获取行外样式,当我们需要获取行外样式时:  我们一般通过这两 ...

  4. 总结获取原生JS(javascript)的父节点、子节点、兄弟节点

    关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...

  5. JS添加节点方法与JQuery添加节点方法的比较及总结

    原生JS添加节点方法与JQuery添加节点方法的比较及总结   一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div ...

  6. 原生JS与jQuery操作DOM对比

    一.创建元素节点 1.1 原生JS创建元素节点 document.createElement("p"); 1.2 jQuery创建元素节点 $('<p></p&g ...

  7. 原生JS和jQuery操作DOM的区别小结

    一.Js原生对象和jQuery实例对象的相互转化: (1).原生JS对象转JQ对象: $(DOM对象); (2). JQ对象转原生JS对象: $(DOM对象).get(index); //注意区分eq ...

  8. 放弃jQuery,使用原生js吧!

    转自:http://itakeo.com/blog/2015/07/28/nojq/ 随着IE6.7.8的逐渐淘汰,HTML5的兴起,以及侧重点放在了移动端,jQuery可能变的不在那么重要,原生一样 ...

  9. 常用原生JS方法总结(兼容性写法)

    经常会用到原生JS来写前端...但是原生JS的一些方法在适应各个浏览器的时候写法有的也不怎么一样的... 今天下班有点累... 就来总结一下简单的东西吧…… 备注:一下的方法都是包裹在一个EventU ...

随机推荐

  1. [Docker] Windows 宿主环境下,共享或上传文件到容器的方法

    需求如题. 解决方案1 - 挂载目录(适用于创建新的容器) 格式-v 容器目录 或 -v 本地目录:容器目录 范例Linux宿主环境下:使用镜像 nginx:latest,以后台模式启动一个容器,将容 ...

  2. Delphi TButton.OnClick 匿名函数用法

    type TNotifyEventRef = reference to procedure(Sender: TObject); function AnonymousEvent(const Proc: ...

  3. day26——tyoe元类与object的联系、反射、函数与方法的区别、双下方法

    day26 type元类与object联系 type 获取对象从属于的类 python 中一切皆对象, 类在某种意义上也是一个对象,python中自己定义的类,以及大部分内置类,都是由type元类(构 ...

  4. SSM整合学习 一

    一:新建maven项目 File--New Project选择maven项目下的maven-archetype-webapp,输入GroupId.Artifactld,选择maven信息,新建mave ...

  5. Unity - LayerMask简析

    本文简述了LayerMask的定义,后通过项目实战充分解析 LayerMask中的GetMask.LayerToName.NameToLayer 等函数的使用方法及其注意事项. 项目地址:3D坦克大战 ...

  6. 《JAVA高并发编程详解》-程序可能出现死锁的场景

  7. C#获取文件夹下的所有文件的方法

    目录 #基础知识 #只获取目录下一级的文件夹与文件 # 递归地输出当前运行程序所在的磁盘下的所有文件名和子目录名 正文   #基础知识 1.获得当前运行程序的路径 1 string rootPath ...

  8. Spring-Cloud之Feign声明式调用-4

    一.Feign受Retrofit.JAXRS-2.0和WebSocket影响,采用了声明式API 接口的风格,将Java Http 客户端绑定到它的内部. Feign 首要目的是将 Java Http ...

  9. Angular复习笔记5-指令

    Angular复习笔记5-指令 在Angular中,指令是一个重要的概念,它作用在特定的DOM元素上,可以扩展这个元素的功能,为元素增加新的行为.本质上,组件可以被理解为一种带有视图的指令.组件继承自 ...

  10. Tensorflow替换静态图中的OP

    import tensorflow as tf import collections from tensorflow.core.framework import tensor_shape_pb2 # ...