DOM：Document    Object   Model  文档对象模型

DOM分类：Dom core;HTML Dom;Css Dom;

一、根据层次访问节点：

　　　parentNode 返回节点的父节点

　　　childNodes 返回子节点集合，childNodes[i]

　　　firstChild 返回节点的第一个子节点，最普遍的用法是访问该元素的文本节点

　　　lastChild 返回节点的最后一个子节点

　　　nextSibling 下一个节点

　　　previousSibling 上一个节点

二、解决浏览器兼容问题：　

　　firstElementChild 返回节点的第一个子节点，最普遍的用法是访问该元素的文本节点

　　lastElementChild 返回节点的最后一个子节点

　　nextElementSibling 下一个节点

　　previousElementSibling 上一个节点

　　例如：ONext = OParent.nextElementSibling || OParent.nextSibling

三、节点信息：

　　nodeName：节点名称

　　nodeValue：节点值

　　nodeType：节点类型

四、操作节点样式：

五、元素属性：　

　　offsetLeft 返回当前元素左边界到它上级元素的左边界的距离，只读属性

　　offsetTop 返回当前元素上边界到它上级元素的上边界的距离，只读属性

　　offsetHeight 返回元素的高度

　　offsetWidth 返回元素的宽度

　　offsetParent 返回元素的偏移容器，即对最近的动态定位的包含元素的引用

　　scrollTop 返回匹配元素的滚动条的垂直位置

　　scrollLeft 返回匹配元素的滚动条的水平位置

　　clientWidth 返回元素的可见宽度

　　clientHeight 返回元素的可见高度

六、元素属性应用：　

　　document.documentElement.scrollTop;

　　document.documentElement.scrollLeft;

 

　　或者

　　document.body.scrollTop;

　　document.body.scrollLeft;

七、制作固定广告：

　　

var adver;        window.onload=function(){            adver=document.getElementById("adver");        }        //onscroll:滚动条滚动时触发        window.οnscrοll=function(){            //获取滚动条滚动大小            var scorlltop=document.documentElement.scrollTop||document.body.scrollTop;            var scorllleft=document.documentElement.scrollLeft||document.body.scrollLeft;            //元素跟随滚动条一起变化            adver.style.top=scorlltop+30+"px";            adver.style.left=scorllleft+10+"px";        }