JavaScript-DOM

DOM基础

什么是DOM

-DOM（文档对象模型-document）是针对HTML和XML文档的一个API（应用程序编程接口）。DOM描绘了一个层次化的节点树，允许开发人员添加、移除和修改页面的某一部分。

浏览器支持情况

-FireFox>Chorem>IE

---

DOM节点

子节点

childNodes/IE6-8 /数组
注意：只算第一层的，不算标签内的标签

文本节点：不包含在任何便签内
元素节点：包含在标签内的文本或者标签本身

nodeType：节点类型

//nodeType==3  该节点为文本节点
//nodeType==1  该节点为元素节点

children 可代替childNodes 不包括文本节点 方便操作

首尾子节点

//兼容性问题
firstChild(低版本浏览器)、firstElementChild(高版本浏览器)
lastChild、lastElementChild

兄弟节点

nextSibling、nextElementSibling
previousSibling、previousElementSibling

父节点

parentNode
父节点应用：信息隐藏

offsetParent：获取一个元素定位的父级（获取元素的实际位置）

---

操纵元素属性

获取：getAttribute('属性')
设置：setAttribute('属性','值')
删除：removeAttribut('属性')

---

DOM元素的灵活查找

用className选择元素

    //封装函数 基础操作
    function getByClass(oParent, sClass )
    {
    var aResult=[];
    var aEle=oParent.getElementsByTagName('*');
    for(var i=0;i<aEle.length;i++)
    {
        id(aEle[i].className==sClass)
        {
        aResult.push(aEle[i]);
        }
    }
    return aResult;

    }