标签：
DOM:文档对象模型,Document Object Model
定义如何获取,删除,添加和修改html元素的标准
DOM分两种:HTML DOM和XML DOM
每一个标签都是一个节点,节点也称之为元素
DOM节点:是DOM结构中最基本的组成单元
按层次划分:父节点,子节点,兄弟节点
父子节点:上下两层关系
兄弟节点:同一级关系
祖先节点:当前节点上面所有节点的统称
子孙节点:当前节点下面所有节点的统称
按类型划分:元素节点,属性节点,文本节点,注释节点,document节点
元素节点:html标签,如p标签,li标签等
属性节点:元素上各种属性,如id,href等
文本节点:文本,特殊符号,换行符,制表符
注释节点:文档中的注释
document节点:特有的document对象
元素节点:1
属性节点:2
文本节点:3
注释节点:8
document节点:9
BOM:Browser Object Model
定义了关于如何修改删除浏览器相关功能的标准
childNodes:获取到某个节点下的子节点,在标准浏览器会获取到空白文本节点,IE6,7,8不会获取文本节点
childen:获取到某个节点下的子节点,只是获取元素节点,所有浏览器都兼容,不是标准的
parentNode:获取当前元素的父节点
element.firstChild:
获取的是element下的第一个子节点,标准浏览器会获取到空白文本节点,IE6,7,8获取的是第一个元素节点
element.firstElementChild:
获取的是element下的第一个子节点,标准浏览器会取到元素节点,IE6,7,8不支持
没有找到元素的情况下,会返回null
对firstChild和firstElementChild,lastChild和lastElementChild,nextChild和nextElementChild,previousChild和previousElementChild的封装.
注意:封装时标准写在前面,非标准写在后面,所以要写成element.firstElementChild || element.firstChild
function first(element){ var firstElement = element.firstElementChild || element.firstChild; if( !firstElement || firstElement.nodeType !== 1 ){ return null }else{ return firstElement; } }; function last(element){ var lastElement = element.lastElementChild || element.lastChild; if( !lastElement || lastElement.nodeType !== 1 ){ return null }else{ return lastElement; } } function next(element){ var nextElement = element.nextElementSibling || element.nextSibling; if( !nextElement || nextElement.nodeType !== 1 ){ return null }else{ return nextElement; } }; function prev(element){ var prevElement = element.previousElementSibling || element.previousSibling; if( !prevElement || prevElement.nodeType !== 1 ){ return null }else{ return prevElement; } }
标签：
原文地址：http://www.cnblogs.com/sunshinegirl-7/p/5001064.html
