abstract:<!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 元素获得焦点(form表单用得多)--> <!--onblur 元素失去焦点--> <!--onchange 域的内容改变--> <!--onclick 当用户单击某个对象时调用的事件句柄--> <!--ondblclick 当用户双击某个对象时调用的事件句柄--> <!--onkeydown 某个键盘按键被按下--> <!--onkeyup 某个键盘按键被松开--> <!--onload 一张页面或一幅图像完成加载--> <!--onmousedown 鼠标按钮被按下--> <!--onmouseout 鼠标从某元素移开--> <!--onmouseover 鼠标移动到某个元素之上--> <!--onmouseup 鼠标按钮被松开--> <!--onsubmit 确认按钮被点击--> <script type="text/javascript"> // 函数的内部参数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> <!--鼠标移上移下背景色切换--> <div class="box" onmouseover="dome(this)" onmouseout="dome1(this)"></div> <!--鼠标单击正方形切换为圆形,双击又恢复正方形--> <div class="box" onclick="dome2(this)" ondblclick="dome3(this)"></div> <form action=""> 输入内容吧→→<input type="text" onfocus="dome1(this)" onblur="dome4(this)"> </form> </body> </html>
Correcting teacher:查无此人Correction time:2019-03-26 09:20:32
Teacher's summary:完成的不错。js事件很重要,要多练习。记住一些常用的。