childNodes的兼容性问题

元素.childNodes:只读 属性 子节点列表集合

标准浏览器下:包含文本和元素类型节点,也会包含非法嵌套的子节点

非标准浏览器下:只包含元素类型节点,ie7下不会包含非法嵌套的子节点

childNodes只包含一级子节点,不包含后辈孙级节点

我们来看例子:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<div>
    <ul id="u1">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <p></p>
    </ul>
</div>
<script>

var dom = document.getElementById(‘u1‘);
alert(dom.childNodes.length);
</script>
</body>
</html>

ie9以上:

ie8:

ie7:

由此可见childNodes的兼容性问题比较大,所以在工作中推荐使用children

时间: 2024-08-24 09:00:33

childNodes的兼容性问题的相关文章

(转)妙味课堂—JavaScrip中级课程笔记

DOM基础概念.操作 DOM的概念及节点类型 childNodes children nodeType attributes 子节点和兄弟节点的操作 firstChild firstElementChild lastChild.lastElementChild nextSibling.previousSibling 父节点 parentNode offsetParent 元素位置宽高 offsetLeft.offsetTop offsetWidth.offsetHeight getPos() 操

JS DOM知识点

DOM(document Object Model)文档对象模型 childNodes有兼容性问题,需要nodeType兼容alert(child.nodeType) chrome ,firfox IE9[7] IE8[3]if(child.nodeType==1){} 获取和设置内容,属性,样式length [数组的长度]value [获取设置input的内容]innerHTML[支持HTML标签,所以隐藏]inneText [不支持HTML标签,所以显示h1] obj.getAttritud

浏览器的兼容性问题

1. 默认的内外边距不同 问题: 各个浏览器默认的内外边距不同 解决: *{margin:0;padding:0;} 2. 水平居中的问题 问题: 设置 text-align: center ie6-7文本居中,嵌套的块元素也会居中 ff /opera /safari /ie8文本会居中,嵌套块不会居中 解决: 块元素设置 1.margin-left:auto;margin-right:auto 2.margin:0 auto; 3.<div align=”center”></div&g

js在IE和FF下的兼容性问题

长久以来JavaScript兼容性一直是Web开发者的一个主要问题.在正式规范.事实标准以及各种实现之间的存在的差异让许多开发者日夜煎熬.为此,主要从以下几方面差异总结IE和Firefox的Javascript兼容性: 一.函数和方法差异: 二.样式访问和设置: 三.DOM方法及对象引用: 四.事件处理: 五.其他差异的兼容处理. 一.函数和方法差异 1. getYear()方法 [分析说明]先看一下以下代码: [javascript] view plaincopy var year=new D

childNodes在IE与Firefox中区别

嗯,这是前几天写一个遍历双层List集合,动态输出对应的表格并且控制固定表头的效果时发现的一个知识点,程序编好后在IE8浏览器下测试没问题,在Firefox35.0.1总是报错,后来发现是IE与FF对HTML元素中的childNodes属性的“理解”不同造成的,这里记录一下,目的在于让自己记得浏览器中还有许多类似的不兼容性的问题,以后编程的时候需要多加的注意,当然,一步步的调试加上精准的定位问题,是解决问题的常用和极佳的方式! OK,让简单的代码来发话吧! 1:简单的测试代码段一 <!DOCTY

兼容性的各种小问题

1. 默认的内外边距不同 问题: 各个浏览器默认的内外边距不同 解决: *{margin:0;padding:0;} 2. 水平居中的问题 问题: 设置 text-align: center ie6-7文本居中,嵌套的块元素也会居中 ff /opera /safari /ie8文本会居中,嵌套块不会居中 解决: 块元素设置 1.margin-left:auto;margin-right:auto 2.margin:0 auto; 3.<div align=”center”></div&g

Javascript的IE跟Firefox(火狐)兼容性-转

Javascript的IE和Firefox(火狐)兼容性-转 em 问题(1)现有问题:现有代码中存在许多 documenem("itemName") 这样的语句,不能在Firefox(火狐)下运行(2)解决方法:改用 document.formName.elements["elementName"](3)其它参见 2 2. 集合类对象问题(1)现有问题:现有代码中许多集合类对象取用时使用 (),IE 能接受,Firefox(火狐)不能.(2)解决方法:改用 []

原生javascript兼容性问题

1.获取样式表里面的width,border color 之类的css(不是行间) 主要是IE6-7支持currentStyle,标准浏览器支持getComputedStyle; 实例:封装函数 复制代码代码如下: function getStyle(obj,name){ if(obj.currentStyle){ return obj.currentStyle[name]; } else{ return getComputedStyle(obj,false)[name]; } } 调用:get

脚本的浏览器兼容性问题

1.window对象不要去掉 window.parent.location 2.firefox和ie内置的对象确实不一样,你用jquery吧这个是跨浏览器的,只需要 $("#yourID").parent()就直接可以得到了 很方便,而且jquery也比较小,只有几十k,现在浏览器这么多 不可能不用跨浏览器解决方案的. 楼主不是通过http协议访问的吧,通过file协议webkit核心(chrome和360极速模式)parent,opener不能互访,会报错 以下以 IE 代替 Int