HTML DOM样式设置、DOM 事件

HTML DOM样式设置

　

　　HTML DOM
　　　　1，标签体的设置和获取:innerHTML

　　　　2．使用html元素对象的属性
　　　　3．控制元秦样式
　　　　　　1．使用元臻的style属性来时设置　　

　　　　　　　　//修改样式方式1
　　　　　　　　div1.style.border = "1px solid red";
　　　　　　　　div1.style.width = "20opx" ;
　　　　　　　　　l/font-size--> fontsize

　　　　　　　　div1.style.fontsize = "2opx";

案例：

　　我们来写一个点击样式

　　

<div id="div1">
    div
</div>
<script>
    var id = document.getElementById("div1");
    id.onclick = function (){
        id.style.border="5px solid red";
        id.style.width="200px";
    }
    id.style.fontStyle = "20px";
</script>

运行结果：

　　

 

 

 点击后的效果：

　　

 

 

DOM 事件

事件：某些操作，如：点击，双击

事件源：组件：如：文本输入框

监听器：代码

注册监听：将事件，事件源，监听器结合在一起

 

常见的事件：

　　　　onclick：单机事件

　　　　ondblclick：双击事件

加载事件：

　　　　onload：一张页面完成加载

鼠标事件：

　　　　

　　　　1. onmousedown鼠标按钮被按下。

　　　　2. onmouseup鼠标按键被松开。

　　　　3. onmousemove鼠标被移动。
　　　　4. onmouseover鼠标移到某元秦之上。

　　　　5. onmouseout 鼠标从某元秦移开。|

选择和改变
　　　　1. onchange 域的内容被改变。

　　　　2. onselect文本被选中。

表单事件:
　　　　1. onsubmit确认按钮被点击。

　　　　2. onreset重置按钮被点击。