1、childNodes:获取节点,不同浏览器表现不同;

  IE:只获取元素节点;

  非IE:获取元素节点与文本节点;

  解决方案:if(childNode.nodeName=="#text") continue 或者 if(childNode.nodeType != '3') continue

2、children:获取元素节点,浏览器表现相同。

  因此建议使用children。

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与nextElementChild

  相同点:获取后一个兄弟节点对象;

  不同点:1、nextSibling:IE6,7,8:后一个兄弟元素节点;

               非IE6,7,8:后一个兄弟节点,文本节点或者元素节点;

      2、lastElementChild:IE6,7,8:不支持;

                  非IE6,7,8:后一个兄弟元素节点;

6、previousSibling与previousElementChild

  相同点:获取前一个兄弟节点对象;

  不同点:1、previousSibling:IE6,7,8:前一个兄弟元素节点;

               非IE6,7,8:前一个兄弟节点,文本节点或者元素节点;

      2、previousElementChild:IE6,7,8:不支持;

                  非IE6,7,8:前一个兄弟元素节点;

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

8、offsetParent:获取第一个设置定位的父元素;

offsetLeft:获取离第一个定位父元素的左距离;

offsetTop:获取离第一个定位父元素的上距离;

javascript中childNodes与children的区别的更多相关文章

  1. JavaScript中childNodes和children的区别

    我在学习JavaScript对DOM操作的过程中,发现了使用childNodes属性,得不到我想要的结果,因此我就从JavaScript高级程序设计中了解了childNodes和children的区别 ...

  2. Javascript 中childNodes和children的区别

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  3. JavaScript中childNodes、children、nodeValue、nodeType、parentNode、nextSibling详细讲解

    其中属性.元素(标签).文本都属于节点 <title></title> <scripttype="text/javascript"> windo ...

  4. js表单验证处理和childNodes 和children 的区别

    一.对提交表单进行空值验证 html代码: <form action="#"onsubmit="return validate_form(this);" ...

  5. JavaScript中:表达式和语句的区别

    JavaScript中:表达式和语句的区别 Javascript语言精粹:表达式是由运算符构成,并运算产生结果的语法结构.程序是由语句构成,语句则是由“:(分号)”分隔的句子或命令.如果在表达式后面加 ...

  6. JavaScript中Element与Node的区别,children与childNodes的区别

    关于Element跟Node的区别,cilldren跟childNodes的区别很多朋友弄不清楚,本文试图让大家明白这几个概念之间的区别. Node(节点)是DOM层次结构中的任何类型的对象的通用名称 ...

  7. Javascript中setTimeout和setInterval的区别和使用

    在javascript中,window对象有两个主要的定时方法,分别是setTimeout 和 setInterval,其语法基本上相同,但是完成的功能取有区别. setTimeout方法是定时程序, ...

  8. JavaScript 中 Property 和 Attribute 的区别详解

    property 和 attribute非常容易混淆,两个单词的中文翻译也都非常相近(property:属性,attribute:特性),但实际上,二者是不同的东西,属于不同的范畴. property ...

  9. javascript中typeof与instanceof的区别

    JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的.但它们之间还是有区别的: typeof typeof 是一个一元运算,放在一个运算数之前 ...

随机推荐

  1. StarUML 5.0问题解决:Failed to open the model file. Invalid file format.

    使用StarUML 5.0打开一个已有的文件时,如果遇到报"Failed to open the model file. Invalid file format."错误,则原因可能 ...

  2. visualstudio 2013 mysql entityframework :实体模型无法添加,闪退

    发现电脑中安装的mysql-connector-net,版本为6.9.8 1.卸载此版本 2.重新安装mysql-connector-net 6.8.3 3.注意web.config中版本 4.注意项 ...

  3. MFC中的一般经验之谈4

    MFC中的窗口控件,都是从CWnd类中继承的.MFC以及ResourceEditor支持的所有控件称为标准控件. 在对话框资源文件夹下,然后邮件新建添加新对话框,新建对话框后要在资源视图中的对话框文件 ...

  4. 无线破解那点事(PJ)

    有一段时间没有写博客了.只能说苦逼学生党伤不起啊,还好没挂-废话不说了,近期将会讲讲无线PJ那点事,也不是啥干货,就一些先前的笔记分享把. 0.无线网卡 想要提高破解效率,一块猛一点的USB无线网卡是 ...

  5. corss、inner、outer三种join方式

    cross join(没有on)inner join(一般用于交集)outer join(你懂得)后面两个 on 1=1 效果同cross join

  6. IIS服务器添加网站

    1.添加IIS服务:对“我的电脑”右键,管理,点击服务和应用程序,如果下面没有”Internet Information Services(IIS)管理器“,打开控制面板,点击程序,启用或者关闭Win ...

  7. FIM控制同步用户

     C:\Program Files\Microsoft Office Servers\15.0\Synchronization Service\UIShell 这个路径下,你如果懂FIM,可以进去看看 ...

  8. console使用技巧

    http://heikezhi.com/yuanyi/10%E4%B8%AAchrome%20console%E5%AE%9E%E7%94%A8%E5%B0%8F%E6%8A%80%E5%B7%A7 ...

  9. [POJ-3237] [Problem E]

    Tree Time Limit: 5000MS   Memory Limit: 131072K Total Submissions: 13156   Accepted: 3358 题目链接 http: ...

  10. Python3.5 学习三

    对文件的操作 打开模式: 1 f=open("xxx","r",encoding=="utf-8") 只读 2 f=open("x ...