加载中…
个人资料
大千世界
大千世界
  • 博客等级:
  • 博客积分:0
  • 博客访问:54,195
  • 关注人气:10
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
相关博文
推荐博文
谁看过这篇博文
加载中…
正文 字体大小:

【JavaScript基础NO.7】JS事件详解

(2017-11-22 16:20:50)
标签:

javascript

html5

js事件

分类: html5
一、事件流
1.事件流:描述的是在页面中接受事件的顺序
2.事件冒泡:由最具体的元素接收,然后逐级向上传播至最不具体的元素的节点
3.事件捕获:最不具体的节点先接收事件,而最具体的节点应该最后接收事件

二、事件处理

1.HTML事件处理:
直接添加到HTML结构中;缺点:牵一发则动全身,修改比较多
2.DOM0级事件处理
把一个函数赋值给一个事件处理程序属性;缺点:事件会被覆盖
【JavaScript基础NO.7】JS事件详解

【JavaScript基础NO.7】JS事件详解


3.DOM2级事件处理
addEventListener(“事件名”,“事件处理函数”,“布尔值”);
true:事件捕获
false:事件冒泡
removeEventListener();
【JavaScript基础NO.7】JS事件详解
一般DOM0级事件处理和DOM2级事件处理结合使用

4.IE事件处理程序(《=IE8的版本)
attachEvent 添加事件
detachEvent 移除事件
使用方法和上面一样
【JavaScript基础NO.7】JS事件详解

三、事件对象
1.事件对象:
在触发DOM事件的时候会产生一个对象
2.事件对象event:
1)type :获取事件类型
2)target:获取事件目标
3)stopPropagation(); :阻止事件冒泡
4)preventDefault(); :阻止事件默认行为
【JavaScript基础NO.7】JS事件详解
function showType ( event ) { alert (event  . target) } 获取事件目标
【JavaScript基础NO.7】JS事件详解
function showType ( event ) { alert (event  . type) }获取事件类型
【JavaScript基础NO.7】JS事件详解
function showDiv ( ) { alert (“ div ”) } 事件冒泡
【JavaScript基础NO.7】JS事件详解
扩展知识



0

阅读 评论 收藏 转载 喜欢 打印举报/Report
  • 评论加载中,请稍候...
发评论

    发评论

    以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

      

    新浪BLOG意见反馈留言板 电话:4000520066 提示音后按1键(按当地市话标准计费) 欢迎批评指正

    新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 会员注册 | 产品答疑

    新浪公司 版权所有