一、窗口事件练习:
窗口事件有两种写法:
①写在script标签中,即:
<script>
window.onload = init;
</script>
当写在script中时,window.onload = 函数名。
注意:此时,函数名后一定不要加括号()
②写在body标签里边,即
<body onload = init()></body>
当写在body标签里时,onload = 函数名();
注意:此时,函数名后 要加上括号()。
例如:
<!DOCTYPE html>
<html lang="zh">
<head>
<title>窗口事件</title>
<meta charset="utf-8">
<script type="text/javascript">
window.onload = init;//窗口事件
function init(){
alert('这是窗口事件');
}
</script>
</head>
<body>
abdc
</body>
</html>
此时,只有当窗口事件执行成功后,才能在页面上显示“ abdc”。
--------------------------------------------分割线----------------------------------------
event事件:可以获取鼠标坐标。
注意:event只能以实参的形式来进行利用。
下面我们写一个可以追踪鼠标所在的坐标的小程序:
<!DOCTYPE html>
<html lang="zh">
<head>
<title>移动瞄准案例</title>
<meta charset="utf-8">
<style type="text/css">
div{
width: 1000px;
height: 200px;
border: solid red;
}
</style>
<script type="text/javascript">
function fn(e) {
var obj = document.getElementById("d1");
var x = e.clientX;
var y = e.clientY;
obj.innerHTML ="坐标" + x + ','+ y;
// if(fm()){
// obj.innerHTML="鼠标已出框";
// }
}
function fm(){
var obj = document.getElementById("d1");
obj.innerHTML="鼠标已出框";
}
</script>
</head>
<body>
<div οnmοusemοve="fn(event)" οnmοuseοut="fm()" id="d1">
</div>
</body>
</html>
通过上面的小栗子来消化吸收一下~
每天进步一点点~