DOM操作

认识DOM：

普通html代码：

分解为DOM节点层次图：

节点可能分常见三种： 1元素节点（html body head p  及标签 ） 2 文本节点 （li与li之间的文字  用户展示内容）3属性节点（a标签中的href）

例：

获取元素

1、 标签ID值是唯一的   可利用 document.getElementById("id")

 var mye = document.getElementById("con");  

mye 结果为 null 或者 【objcet HTMLparagraphElement】

更改HTML属性：

     Object.innerHTML  

object 是获取元素的对象  通过 document.getElementById("id");  innerHTML区分大小写

例：

var mychar=document.getElementById("con");

document.write(mychar.innerHTML);

mychar.innerHTML = "hello world";

document,write(mychar.innerHTML)

改变HTML样式：  object.style.property = new style;

例：

var mychar = document.getElementById("pcon");

mychar.style.color = "red";

显示和隐藏（display属性）

object.style.display = value;  value 值为 none（隐藏） 或 block（显示为块级元素）

例：

var mychar = document.getElementById("con");
function hidetext(){
mychar.style.display = "none";
}
function showtext(){
mychar.style.display = "block";
}

控制className属性（类名）

object.className = className;

获取元素class属性，改为网页内某元素制定的CSS样式改变外观