JavaScript之鼠标事件

事件三要素:
事件源.事件类型(点击onclick)=function(){
事件触发后执行的代码
}

案例:

function abb(a){
return document.getElementById(a);
}
abb('box').onmouseenter=function(){
// onmouseenter鼠标移入
// 在事件中,this指代事件源
abb('box').style.background = 'yellow';
}
abb('box').onmouseleave=function(){
// onmouseleave鼠标移出
this.style.background = 'tomato';
}

abb('input').onfocus=function(){
// onfocus和onblur事件是表单元素特有
abb('box').style.background = 'black';
}
abb('input').onblur=function(){
abb('box').style.background = 'tomato';
}

onmouseover和onmoueout一组,会触发子元素
onmouseenter和onmouseleave一组,不会触发子元素

猜你喜欢

转载自www.cnblogs.com/msw0803/p/11527068.html
今日推荐