zoukankan      html  css  js  c++  java
  • 面向对象,事件

    面向对象:

    1.单例模式

    2.工厂模式

    3.构造函数

      (1)类

    js天生自带的类

    object基类

    function··array···number··math···Boolean···date···regexp···string·

    1.事件

      浏览器客户端上客户触发的行为都称为事件

    所有的事件都是天生自带的不需要我们去绑定,只需要我们去触发

    通过obj事件名=function(){}

    事件名:

    onmouseover··onmouseout··onmousedown··onmousemove···onmouseup···onclick···onchang···onfocus···onblur··等等

    当用户触发一个事件的时候,浏览器的详细信息都存在一个叫event的对象上我们把它叫做事件对象

    所有事件在绑定方法的时候,天生自带一个参数叫event

    鼠标的坐标

    event.clientx

    event.clienty

    event的兼容性

    在Chrome下event是undefined在ie低版本下是null,狐火下是报错

    2事件冒泡

    什么叫事件冒泡

    当给父子元素的相同事件绑定方法时,触发了子元素身上的事件,执行完毕之后,也会触发父级元素事件,这种传播机制叫事件冒泡

    取消事件冒泡

    event有个属性叫cancelbubble默认值是false改成true就取消事件冒泡

    3.事件捕获

    给一个元素绑定事件,普通写法:

    obj.onclick=function(){}这就相当于给obj的onclick属性值附一个道理

    obj.onclick=function(){}

    这种写法有一点不好,后者会将前者覆盖掉

    事件绑定的第二种写法

    标准浏览器用addeventlistener()这个方法

    ie低版本用attachevent()这个方法

    eventlistener(参数1,参数2,参数3)

    参数1·是事件名·事件名不能带on

    参数2·事件函数

    参数3·布尔值,代表捕获或不捕获·默认是flase不捕获但也是冒泡

    事件捕获

    1.ie低版本没有捕获

    2.普通事件绑定写法没有捕获

    事件捕获

    给父子元素用addeventlistener()绑定同一个事件时,当触发子元素身上的事件,然后在传递给子元素,这种传播机制叫事件捕获

    Attachevent()和addeventlistener()二者区别

    1. attachevent只用在ie8以下,addeventlistener()适合标准的。
    2. attachevent的事件名带on而addeventlistener事件名不带on
  • 相关阅读:
    【webpack 系列】进阶篇
    【webpack 系列】基础篇
    手写 Promise 符合 Promises/A+规范
    React-redux: React.js 和 Redux 架构的结合
    Redux 架构理解
    javascript 中的 this 判定
    编译原理
    vue 响应式原理
    强大的版本管理工具 Git
    js实现跨域(jsonp, iframe+window.name, iframe+window.domain, iframe+window.postMessage)
  • 原文地址:https://www.cnblogs.com/zzz035921/p/10043945.html
Copyright © 2011-2022 走看看