children和childNodes的区别
children和childNodes
1,childNodes 属性,标准的,它返回指定元素的子元素集合,包括HTML节点,所有属性,文本。可以通过nodeType来判断是哪种类型的节点,只有当nodeType==1时才是元素节点,2是属性节点,3是文本节点。
有些人错误的使用()去取该集合元素,下表列出各浏览器对childNodes(i)的支持情况:
|
IE6/7/8/Safari/Chrome/Opera | IE9/Firefox |
childNodes(i) | 支持 | 不支持 |
有时候需要获取指定元素的第一个HTML子节点(非属性/文本节点),最容易想到的就是firstChild 属性。代码中第一个HTML节点前如果有换行,空格,那么firstChild返回的就不是你想要的了。可以使用nodeType来判断下。
1
2
3
4
5
6
|
function getFirst(elem){ for ( var i=0,e;e=elem.childNodes[i++];){ if (e.nodeType==1) return e; } } |
2,children 属性,非标准的,它返回指定元素的子元素集合。经测试,它只返回HTML节点,甚至不返回文本节点。且在所有浏览器下表现惊人的一致。和childNodes 一样,在Firefox下不支持()取集合元素。因此如果想获取指定元素的第一个HTML节点,可以使用children[0]来替代上面的getFirst函数。需注意children在IE中包含注释节点。
children和childNodes的区别的更多相关文章
- JavaScript中Element与Node的区别,children与childNodes的区别
关于Element跟Node的区别,cilldren跟childNodes的区别很多朋友弄不清楚,本文试图让大家明白这几个概念之间的区别. Node(节点)是DOM层次结构中的任何类型的对象的通用名称 ...
- children 和childNodes 的区别
1:childNodes /children相同点:它返回指定元素的子元素集合. 2:区别:children : 它是非标准的,仅返回HTML节点.甚至不返回文本节点.所有浏览器表现一 致. chi ...
- children和childNodes 的区别
1.childNodes 属性,标准的,它返回指定元素的子元素集合,包括html节点,所有属性,文本.可以通过nodeType来判断是哪种类型的节点,只有当nodeType==时才是元素节点,是属性节 ...
- parentNode、parentElement,childNodes、children 它们有什么区别呢?
parentNode.parentElement,childNodes.children 它们有什么区别呢?parentElement 获取对象层次中的父对象. parentNode 获取文档层次中的 ...
- jQuery 中的children()和 find() 的区别
<!DOCTYPE html> <html> <head> <script type="text/javascript" src=&quo ...
- 基于jquery中children()与find()的区别介绍
本篇文章介绍了,基于jquery中children()与find()的区别,需要的朋友参考下 .children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选 ...
- jquery遍历之children()与find()的区别
hildren(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选,添加参数表示通过选择器进行过滤,对元素进行筛选. .find(selector)方法是返回匹配元 ...
- JS中,children和childNodes的不同之处
<ul id="ul"><li></li><li></li><li><span></spa ...
- child和childNodes的区别
child和childNodes区别: childNodes是标准属性, child是非标准属性 childNodes: 获取节点,不同浏览器表现不同 IE 只获取元素节点 非IE 获取元素节点和文本 ...
随机推荐
- PHP数组合并的常见问题
一维数组的合并 <?php $arr1=array("a","b","c"); $arr2=array("c",& ...
- WPF 实现带标题的TextBox
这篇博客将分享在WPF中如何创建一个带Title的TextBox.首先请看一下最终的效果, 实现思路:使用TextBlock+TextBox来实现,TextBlock用来显示Title. 实现代码, ...
- hdu 4731 2013成都赛区网络赛 找规律
题意:找字串中最长回文串的最小值的串 m=2的时候暴力打表找规律,打表可以用二进制枚举
- Linux学习笔记(1)Linux虚拟机安装过程中的知识点及常用管理工具
1. VMware的相关知识 (1)建议的VMware的配置: CPU 主频1GHz以上 内存 1GB以上 硬盘 分区空闲空间8GB以上 (2)VMware创建快照 快照的作用是保存虚拟机的现有状态, ...
- 如何给你的ASP.NET页面添加HelpPage
如何给你的ASP.NET页面添加HelpPage 最近写了一些webAPI,所以需要搞一套API的帮助文档,google了一下,发现这是可以自动生成的,以下就是如何自动生成HelpPage的说明. 参 ...
- TOMCAT配置外部应用
原来我们都是把项目放到webapps目录下,但其实是可以把项目放到其他文件夹下的,如果把项目放到其他目录下同时也希望tomcat可以运行它,有两种方法: 第一种方法: conf/server.xm ...
- Ubuntu中如何打开终端terminal
法一 先按住Alt,然后再按F2,出来一个运行框,在里面输入gnome-terminal即可 [编辑]法二 如果想从右键菜单中打开终端,需要安装一个软件: sudoapt-get install na ...
- JQuery学习之jQuery尺寸
1.width()和height()方法: width():设置或返回元素的宽度(不包括内边距,边框或外边距) height():设置或返回元素的高度(不包括内边距,边框或外边距) $("b ...
- 浩瀚移动POS收银开单扫描解决方案PDA仓储系统,无线批发,移动批发,无线POS,无线销售APP-车销管理PDA
适用范围 各种业态的批发商铺.批发市场.订货会.展销会.配送中心仓库…… 产品简介 随着移动技术与智能PDA设备的迅猛发展,中国已经跨步进入移动信息化社会.移动商务是移动信息社会的重要载体与形式,它开 ...
- virtualtree 的使用(Delphi)
VirtualTreeview的强大,毋庸置疑,不过,你能给演示演示,也不错,就是刚下来,只有一个可执行程序,感觉像病毒. 最近比较忙,没有上网,现在把我研究的结果和大家通报下,方便新手学习,避免走弯 ...