DOM节点

原创 2006年05月17日 11:17:00

由于DOM(文档对象模型)概念的推出,这个API使HTML如虎添翼,但是有些学DHTML的朋友还是有些困挠,只是因为目前的手册的书写不太科学,是按字母来分的,不便查阅.其实DOM中最关键是要掌握节点与节点之间的关系(between node and node),想学习DHTML中的DOM千万不要从头到尾地看遍所有的属性和方法,你有三国时张松的"过目不忘"的本领吗?没有吧,那就听我分析一下:
其实DOM教给我们的就是一个层次结构,你可以理解为一个树形结构,就像我们的目录一样,一个根目录,根目录下有子目录,子目录下还有子目录……
根节点:
DOM把层次中的每一个对象都称之为节点(NODE),以HTML超文本标记语言为例:整个文档的一个根就是<html>,在DOM中可以使用document.documentElement来访问它,它就是整个节点树的根节点(ROOT)
子节点:
一般意义上的节点,根节点以下最大子节点就是主文档区<body>了,要访问到body标签,在脚本中应该写:
document.body
body区以内所有的文本及HTML标签都是文档的节点,分别称为文本节点、元素节点(或者叫标签节点),大家知道HTML说到底只是文本而矣,不论怎么样的网页必然由这两个节点组成,也只能由这两个节点组成
节点之间的关系:
节点之间的关系也是DOM中最重要的一个关节,如何正确地引用到节点对象,一定要清楚节点树各个节点的相互描述方式,在DHTML里,Javascript脚本就用了各个节点对象的一整套方法和属性去描述另外的节点对象。

节点的绝对引用:
返回文档的根节点
document.documentElement
返回当前文档中被击活的标签节点
document.activeElement
返回鼠标移出的源节点
event.fromElement
返回鼠标移入的源节点
event.toElement
返回激活事件的源节点
event.srcElement
节点的相对引用:(设当前对节点为node)
返回父节点
node.parentNode
node.parentElement
返回子节点集合(包含文本节点及标签节点)
node.childNodes
返回子标签节点集合
node.children
返回子文本节点集合
node.textNodes
返回第一个子节点
node.firstChild
返回最后一个子节点
node.lastChild
返回同属下一个节点
node.nextSibling
返回同属上一个节点
node.previousSibling
节点的各种操作:(设当前的节点为node)
新增标签节点句柄:
document.createElement(sNode) //参数为要新添的节点标签名,例:newnode=document.createElement("di

dom节点的添加与删除

  • 2013年04月01日 15:57
  • 3KB
  • 下载

jQuery DOM节点操作源码

  • 2015年10月15日 17:45
  • 307KB
  • 下载

DOM操作——怎样添加、移除、移动、复制、创建和查找节点

(1)创建新节点       createDocumentFragment()    //创建一个DOM片段       createElement()   //创建一个具体的元素 ...

AJAX入门---DOM节点的属性和方法

  • 2014年08月04日 21:00
  • 812KB
  • 下载

DOM節點方法及事件

  • 2009年07月04日 10:17
  • 37KB
  • 下载

Dom4j解析xml文件-操作节点和属性及写入其他xml文件

引言        上一篇把Dom4j遍历xml文件的所有节点和属性分享了一下,这篇我就简单明了的分享一下,对xml文件的各个节点及属性进行增、删、改的操作并写入新的或者保存到xml文件中,下边的代码...

angular动态删除ng-repaeat添加的dom节点

在实际练习中通过点击删除按钮删除数据库信息以及当前航html代码如下: ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:DOM节点
举报原因:
原因补充:

(最多只允许输入30个字)