DOM

1javascript语法



2、HTML DOM对象
<script type="text/javascript"></script>

document: 文档对象

1）访问HTML元素
您能够以不同的方式来访问 HTML 元素：
    通过使用 getElementById() 方法
    通过使用 getElementsByTagName() 方法
    通过使用 getElementsByClassName() 方法

2）获取、修改属性的值
getAttribute() 返回指定的属性值。
setAttribute() 把指定属性设置或修改为指定的值。
元素对象.属性名称 = 值

3）获取样式、设置样式
   元素对象.style.样式名 = 值。

3）DOM属性
   innerHTML
   innerText


4) DOM事件
事件 = javascript
document.onload   --- 加载文档
element.onclick  ---- 点击事件
element.onmouseover --- 鼠标悬浮事件
element.onchange  --- 输入的字段验证

示例：
<button onclick="displayDate()" id="press">试一试</button>

<script>
# 方式一
# function displayDate()
# {document.getElementById("demo").innerHTML=Date();}
# 方式二
document.getElementById("press").onclick=function(){
    document.getElementById("demo").innerHTML=Date();
}

</script>

<p id="demo"></p>



3) 创建新的HTML元素。
<script>
var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);

var element=document.getElementById("d1");
element.appendChild(para);
</script>