2020914王杉

学习内容:

  • 事件绑定:

    1. 在html中绑定:标签绑定;在js中绑定函数表达式。
    2. js动态中绑定:一个事件绑定一个函数(不能被remove移除只能事onXX=null),一个事件绑定多个函数(一个函数被移除不能使用匿名函数,必须指定有名函数)。
  • 事件模型:

    1. DOM:捕获、目标触发、冒泡
    2. IE8:目标触发、冒泡
  • 事件对象:

    1. 事件对象:①事件发生时自动创建②封装事件信息③提供操作事件的API的对象

    2. 获取:事件对象默认作为处理函数的第一个参数传入

    3. 操作:

      ①取消冒泡/停止蔓延:stopPropagation;

      ②利用冒泡:少量使用监听事件(影响用户体验)

      ③取消事件/阻止默认行为:preventDefault

      ④事件坐标:屏幕左上角e.screenX/e.screenY

      ​ 相对文档显示左上角e.clientX/e.clientY

      ​ 相对触发事件元素的左上角e.offsetX/e.offsetY

  • 页面滚动:

    1. 事件:window.onscroll
    2. 获取页面滚动过的高度:document.body.scrollTop || document.documentElement.scrollTop 两种考虑兼容问题
    3. 方法:window.scrollBy(left的增量,top增量) window.scrollTo(left,top)到哪个位置

学习心得:

​ 今天学习了BOM的事件剩下的,主要是一些事件的绑定、对象模型和坐标,然后今天做了一个子弹发射的练习主要是对绑定事件和移除事件的熟悉,还有就是鼠标的移动事件,为了熟悉事件委托做了个简单小计算器,剩下的就是对窗口事件的学习,内容不多能熟悉掌握。

评论