摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title&g
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.box{width: 100px;height: 100px;background-color: #cccccc;border: 1px solid #cccccc;margin: 50px 0;}
</style>
</head>
<body>
<!--屬性 描述-->
<!--onfocus 元素獲得焦點(diǎn)(form表單用得多)-->
<!--onblur 元素失去焦點(diǎn)-->
<!--onchange 域的內(nèi)容改變-->
<!--onclick 當(dāng)用戶單擊某個(gè)對(duì)象時(shí)調(diào)用的事件句柄-->
<!--ondblclick 當(dāng)用戶雙擊某個(gè)對(duì)象時(shí)調(diào)用的事件句柄-->
<!--onkeydown 某個(gè)鍵盤按鍵被按下-->
<!--onkeyup 某個(gè)鍵盤按鍵被松開(kāi)-->
<!--onload 一張頁(yè)面或一幅圖像完成加載-->
<!--onmousedown 鼠標(biāo)按鈕被按下-->
<!--onmouseout 鼠標(biāo)從某元素移開(kāi)-->
<!--onmouseover 鼠標(biāo)移動(dòng)到某個(gè)元素之上-->
<!--onmouseup 鼠標(biāo)按鈕被松開(kāi)-->
<!--onsubmit 確認(rèn)按鈕被點(diǎn)擊-->
<script type="text/javascript">
// 函數(shù)的內(nèi)部參數(shù)x作為局部變量而言，起到的作用僅僅是占位符而已
function dome(x) {
x.style.background='pink';
}
function dome1(x) {
x.style.background='red';
}
function dome2(x) {
x.style.borderRadius='50px';
}
function dome3(x) {
x.style.borderRadius='0px';
}
function dome4(x) {
x.style.background='white';
}
</script>
<!--鼠標(biāo)移上移下背景色切換-->
<div class="box" onmouseover="dome(this)" onmouseout="dome1(this)"></div>
<!--鼠標(biāo)單擊正方形切換為圓形，雙擊又恢復(fù)正方形-->
<div class="box" onclick="dome2(this)" ondblclick="dome3(this)"></div>
<form action="">
輸入內(nèi)容吧→→<input type="text" onfocus="dome1(this)" onblur="dome4(this)">
</form>
</body>
</html>
批改老師：查無(wú)此人批改時(shí)間：2019-03-26 09:20:32
老師總結(jié)：完成的不錯(cuò)。js事件很重要，要多練習(xí)。記住一些常用的。