DOM第一节

获取节点:

document.getElementById("")

document.getElementByTagName("") 支持IE678及标准浏览器还有移动端,不太好用,

document.getElementByClassName("")不支持IE678 至少IE9以上

document.querySelector("")

document.querySelectorAll("") //不支持IE678 仅支持标准浏览器和移动端,性能好

获取样式

1.获取行级样式

div.style.color

2.获取css样式

div.getComputedStyle(div,null).border  不支持IE

div.currentStyle.width; 支持IE

function getStyle(ele,type){
    if(window.getComputedStyle){
        return window.getComputedStyle(ele,null).getPropertyValue(type)
    }else if(ele.currentStyle){
        return ele.currentStyle[type]
    }
}

另一种写法:

var yangshi =ele.currentStyle  ||  window.getComputedStyle(ele,null);

return yangshi[type]

一种方法:

    var yangshi =ele.currentStyle?ele.currentStyle:window.getComputedStyle(ele,null);

return yangshi[type]

#123

document.childNodes;子节点,是个集合//

document.childNodes[i] 或.children//没有text节点,不是标准,可能被取缔

上面两种方法没有兼容性问题

firstChild//标准属性

lastChild//标准属性

firstElementChild//标准属性,但是IE678不支持,他们只支持firstChild

lastElementChild//同上

nextSibling

nextElementSibling //678不支持

previousSibling

previousElementSibling//678不支持

以上带有element的节点是标准属性,可以过滤掉空的文本节点

parent

##节点类型

attributes获取当前节点的所有属性集合

0 ===> document 对象节点

1 ===>元素节点

2 ===>属性节点

3 ===>空节点

8 ===>注释节点