（1）定义事件响应的方式
1.定义函数并调用
<!DOCTYPE html>
<html>
<head>
<script>
function changetext(id)
{
id.innerHTML="Ooops!";
}
</script>
</head>
<body>
<h1 οnclick="changetext(this)">Click on this text!</h1>
</body>
</html>2.通过dom来分配
<script>
document.getElementById("myBtn").οnclick=function(){displayDate()};
</script>
（2）典型事件
1.onload和onunload事件
1）会在用户进入或离开页面时触发2）主要用来检测浏览器版本和浏览器类型
3）可以用来处理cookie
<!DOCTYPE html>
<html>
<body οnlοad="checkCookies()">
<script>
function checkCookies()
{
if (navigator.cookieEnabled==true)
{
alert("Cookies 可用")
}
else
{
alert("Cookies 不可用")
}
}
</script>
<p>弹窗-提示浏览器cookie是否可用。</p>
</body>
</html> 2.onchange事件
通常结合对输入字段的验证来使用（ 当离开的时候触发）<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
var x=document.getElementById("fname");
x.value=x.value.toUpperCase();
}
</script>
</head>
<body>
输入你的名字: <input type="text" id="fname" οnchange="myFunction()">
<p>当你离开输入框后，函数将被触发，将小写字母转为大写字母。</p>
</body>
</html>3.onmouseover和onmouseout事件
用于在用户鼠标移至HTML元素上方或移出元素时触发函数<!DOCTYPE html>
<html>
<body>
<div οnmοuseοver="mOver(this)" οnmοuseοut="mOut(this)" style="background-color:#D94A38;width:120px;height:20px;padding:40px;">Mouse Over Me</div>
<script>
function mOver(obj)
{
obj.innerHTML="Thank You"
}
function mOut(obj)
{
obj.innerHTML="Mouse Over Me"
}
</script>
</body>
</html> 
1668
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
