Javascript事件实例详解事件实例详解
document是位于html标签之上的，可以说是权力最大的。下面的实例当你单击页面上的任何位置都会弹出“a”,正是运用了
document的特性。
代码如下:
<script>
document.onclick=function(){
alert(‘a’);
};
</script>
获取鼠标位置clientX,clientY—注意这里仅仅只是可视区的鼠标位置
代码如下:
<script>
document.onclick=function(ev){
if(ev)
{
alert(ev.clientX+’,’+ev.clientY);
}
else{
alert(event.clientX+’,’+event.clentY);
};
};
</script>
或者
代码如下:
<script>
document.onclick=function(ev){
/* if(ev)
{
alert(ev.clientX+’,’+ev.clientY);
}
else{
alert(event.clientX+’,’+event.clentY);
};
};*/
var oEvent=ev||event;
alert(oEvent.clientX+’,’+oEvent.clientY);
};
</script>
事件冒泡—一层一层叠加的元素在一起，形成事件冒泡，比如下面的例子：document的最大范围影响了div的响应。
代码如下:
<script>
window.onload=function(){
var obtn=document.getElementById(‘btn1’);
var odiv=document.getElementById(‘div1’);
obtn.onclick=function(ev){
var oEvent=ev||event;
odiv.style.display=’block’;
oEvent.cancelBubble=true;//清除冒泡
};
document.onclick=function(){
odiv.style.display=’none’;
};
};
</script>
</head>
<body>
<input type=”button” value=”显示” id=”btn1″/>
<div id=”div1″ style=”width:100px;height:150px;background:#ccc;”></div>
</body>
鼠标移动—在可视区有效
代码如下:
<title>鼠标移动</title>
资源评论
