JavaScript常用事件处理详解：从基础到冒泡机制

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>花狗在线</title>
		<script>
		window.onload=function(){
			var mydiv = document.getElementById("mydiv");
			alert("页面加载完成，mydiv的内容是："+mydiv.innerText);
		}
		</script>
	</head>
	<body>
		<div id='mydiv'>我是花狗，花狗的花，花狗的狗。</div>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>花狗在线</title>
		<style>
			html,body{
				width: 100%;
				height: 100%;
			}
		</style>
		<script>
		function mouseclick(){
		alert('页面被单击');
		}
		</script>
	</head>
	<body onclick="mouseclick()">
		<div id='mydiv'>我是花狗，花狗的花，花狗的狗。</div>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>花狗在线</title>
		<style>
			html,body{
				background-color: aquamarine;
				width: 100%;
				height: 100%;
			}
		</style>
		<script>
		function keydown(event){ 
			if(event.keyCode==37){
				alert(event.keyCode +'你按下了左键');
			}
			if(event.keyCode==38){
				alert(event.keyCode +'你按下了上键');
			}
			if(event.keyCode==39){
				alert(event.keyCode +'你按下了右键');
			}
			if(event.keyCode==40){
				alert(event.keyCode +'你按下了下键');
			}
		}
		</script>
	</head>
	<body onkeydown="keydown(event)">
	</body>
</html>