S2 使用jQuery快速高效制作网页交互特效 第三章 JavaScript操作DOM对象知识点

一、DOM操作
1、DOM:是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口
2、使用JavaScript操作DOM是通常分为:DOM Core(核心)、HTML-DOM和CSS-DOM
3、节点和节点关系
 整个文档是一个文档节点
 每个HTML标签是一个元素节点
 包含在HTML元素中的文本是文本节点
 每个HTML属性时一个属性节点
 注释属于注释节点
4、使用父(parent)、子(child)和同胞(sibling)等术语来描述这些节点的层次关系,父节点拥有子节点，同级的子节点陪称为同胞或兄弟节点，他们的关系如下:
 在节点树中,顶部节点被称为根,如节点
 每个节点都有父节点,除了根,
 一个节点可以拥有任意数量的子节点
 同胞节点是拥有相同父节点的节点
5、使用DOM Core访问HTML文档的节点主要有两种方式
 使用getElement系列方法访问指定节点
 getElementById()：返回按id属性查找的第一个对象的引用
 getElementByName()：返回按带有指定名称name查找的对象的集合,由于一个文档中可能会有多个同名节点(如复选框、单选按钮),因此返回的是元素数组
 getElementByTagName()：返回带有指定标签名TagName查找的对象的集合,由于一个文档中可能会有多个同类型的标签节点(如图片组、文本输入框),因此返回元素数组
 根据层次关系访问节点
属性名称 描述
parentNode 返回节点的父节点
childNodes 返回子节点集合,childNodes[i]
firstChild 返回节点的第一个子节点,最普遍的用法是访问该元素的文本节点
lastChild 返回节点的最后一个子节点
nextSibling 下一个节点
previousSi