小结下dom节点操作
作者:风月 来源:阿里妈妈UED 发布时间:2011-03-08 10:33:00
一、节点的定义
dom节点树
图中可见节点HTML文档中的每个成分都是一个节点:
整个文档是一个文档节点
每个HTML标签是一个元素节点
包含在HTML元素中的文本是文本节点
每个HTML属性是一个属性节点
注释属于注释节点
备注:通过DOM,可以访问HTML文档中的每个节点。
二、节点引用
节点的绝对引用:
document.documentElement返回文档的根节点
document.activeElement返回当前文档中被击活的标签节点
event.fromElement返回鼠标移出的源节点
event.toElement返回鼠标移入的源节点
event.srcElement返回激活事件的源节点
节点的相对引用:(设当前对节点为node)
node.parentNode node.parentElement 返回父节点,document.parentNode()返回null
node.childNodes[1] 符合标准,返回子节点集合(包含文本节点及标签节点),文本和属性节点的childNodes永远是null.先获取长度node.childNodes.length,然后可以通过循环或者索引找到需要的节点.
//对与文本节点的处理:
eg:
var myTextNodes = document.getElementById("test").childNodes;
var count = myTextNodes.length;
for(var i = 0; i < count; i++) {
if(myTextNodes[i].nodeType=="3" && myTextNodes[i].nodeName!="#text"){//排除IE空白文本的节点
alert(myTextNodes[i]);
}
}node.children 不符合标准,不推荐使用,它只返回html节点,甚至不返回文本节点
node.firstChild返回第一个子节点,firstChild=childNodes[0]
node.lastChild返回最后一个子节点,lastChide=childNodes[childNodes.length-1]
node.nextSibling()返回同属下一个节点
node.previousSibling()返回同属上一个节点
猜你喜欢
- 摸到她了!青翠的衣衫,奶白的肌肤,捧在手上的感觉真是太好了,心里美滋滋的。《悟透JavaScript》,一本偶然之作,终于成书并出版了。本书
- jQuery的选择器可谓异常强大,没有什么DOM里的任何数据能逃出它的掌心,这点是我非常喜欢的,以前获取NODE要用getElementBy
- 一、如何理解本条内容:一个“简单”和“复杂”的例子在我和开发人员沟通一个项目需求的时候,他们频频慨叹Mockup的设计所考虑情况之细致,很多
- 注:文中未表明的地方output 输出都是基于IE6.0,其中表明FF的地方为Mozilla Firefox2.0,还要注意文中的大小写ja
- 本文介绍了10个asp网页制作的常用到的技巧,有asp的也有javascript。如asp如何获取系统时间,如何取得IP,及浏览
- 从概念上讲,大多数关系数据库系统都是类似的:它们都由一组数据库组成,且每个数据库都包含一组表。但是,所有的系统都有自己的管理数据的方法, M
- 随着jQuery、Mootools、prototype等知名的JavaScript框架的应用变的越来越强大,浏览器对最新版本CSS属性的支持
- 可以自动轮换的页签 tabs with auto play fucntion<html><head><meta
- 请教:如何在现存的文档中动态嵌入一段JS?如果是一段CSS呢?创建一个<script></script>并在scri
- 如果你用SQL Server 2005 Management Studio建立函数或存储过程,你会注意到这些新窗口中都是模板。通常,你可以获
- <!--模板--> <table width="100%" borde
- 为了防止采集,我试过各种方法,绝大多数方法是“ * 剑”---防止了采集,也影响了搜索引擎收录,实在不爽!一天本人忽发奇想:何不
- 今天彬Go要向大家推荐9款很棒的可在网页中绘制图表的JavaScript脚本,这些有趣的JS脚本可以帮助你快速方便的绘制图表(线、面、饼、条
- 在添加新记录时,有时候我们需要将部分动态内容自动添加到指定的文本域,例如上传一个文件后,将文件名自动添加到一个独立的记录框内,以
- 网站上的Banner条,是网站用来作为盈利或者是发布一些重要的信息的工具。但是它又不能作为网页的主要内容,因为它的主要目的是吸引人的注意力,
- 配置环境: 1、数 据 库:Oracle 8i R2 (8.1.7) for NT 企业版 2、安装路径:C:ORACLE 实现方法: 1.
- 代码如下: public function fillzero(l1) if len(l1)=1 then fillzero="0&
- 在过去的两年里,你能想象的一些很烂的应用设计也入驻了优雅的iPhone。通过它周边的宣传,使得世界各地的设计者们都利用这个新的移动工具来一展
- 本教程主要介绍css的基础知识,将逐个讲解css的各个属性,过程可能比较枯燥,但会尽力多举例说明.作者的网站:http://jorux.co
- 常用Mysql查询语句记录一、授权1.授权本地用户对所有数据库具有所有权限> grant all privileges on