Javascript基础（7）DOM简介

1.HTML DOM的属性：
a. innerHTML 获取元素内容的最简单方法
b. nodeValue 获取或规定规定节点的值 ( 元素节点的 nodeValue 是 undefined 或 null
—–文本节点的 nodeValue 是文本本身
—–属性节点的 nodeValue 是属性值)
c. nodeType 获取节点的类型

2.HTML DOM的修改：

       a. 创建内容：document.getElementById("p1").innerHTML="New text!";
       b. 修改样式：document.getElementById("p2").style.color="blue";
       c. 创建元素：var para=document.createElement("p");
            var node=document.createTextNode("This is new.");
            para.appendChild(node);
            //还有另外一种办法是在目标元素前面创建元素：element.insertBefore(para,child);
       d. 删除元素：var parent=document.getElementById("div1");
            var child=document.getElementById("p1");
            parent.removeChild(child);
            //注意：必须通过父元素来删除某个元素，如果想知道它的父元素，可以按这个方法：
                var child=document.getElementById("p1");
                child.parentNode.removeChild(child);
       e. 替换元素：parent.replaceChild(para,child); //将child 替换掉，成 para

3.HTML DOM事件
a. 当用户进入或离开页面时，会触发 onload 和 onunload 事件,可用于处理 cookies
b. onchange事件，可以用来验证表单：
c. 与鼠标有关的系列事件：onmouseover\onmouseout\onmousedown\onmouseup\onclick等等

4.HTML DOM提供了节点导航的一系列方法：
a. 获取某个tag的长度length（个数）
b. 获取根节点，子节点，父节点，节点的值如 nodeValue(功能类似innerHTML)等等
c. 某些方法甚至可以获取整个文档的innerHTML ，如：document.documentElement
详见：http://www.runoob.com/htmldom/htmldom-navigation.html