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

    什么是事件对象

    事件发生后,跟事件相关的一系列信息数据的集合都放到这个对象里面,这个对象就是事件对象。

    比如:

    1. 谁绑定了这个事件。

    2. 鼠标触发事件的话,会得到鼠标的相关信息,如鼠标位置。

    3. 键盘触发事件的话,会得到键盘的相关信息,如按了哪个键。

    事件对象的使用

    事件触发发生时就会产生事件对象,并且系统会以实参的形式传给事件处理函数。

    所以,在事件处理函数中声明1个形参用来接收事件对象。

     

    事件对象的兼容性处理

    事件对象本身的获取存在兼容问题:

    1. 标准浏览器中是浏览器给方法传递的参数,只需要定义形参 e 就可以获取到。

    2. 在 IE6~8 中,浏览器不会给方法传递参数,如果需要的话,需要到 window.event 中获取查找。

    只要“||”前面为false, 不管“||”后面是true 还是 false,都返回 “||” 后面的值。
    只要“||”前面为true, 不管“||”后面是true 还是 false,都返回 “||” 前面的值。

    <div>123</div>
    <script>
      var div = document.querySelector('div');
      div.onclick = function(e) {
        // 事件对象
        e = e || window.event;
        console.log(e);
    }
    </script>

    <!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
        <style>
            div {
                 100px;
                height: 100px;
                background-color: pink;
            }
        </style>
    </head>

    <body>
        <div>123</div>
        <script>
            // 事件对象
            var div = document.querySelector('div');
            div.onclick = function(e) {
                    // console.log(e);
                    // console.log(window.event);
                    // e = e || window.event;
                    console.log(e);


                }
                // div.addEventListener('click', function(e) {
                //         console.log(e);

            //     })
            // 1. event 就是一个事件对象 写到我们侦听函数的 小括号里面 当形参来看
            // 2. 事件对象只有有了事件才会存在,它是系统给我们自动创建的,不需要我们传递参数
            // 3. 事件对象 是 我们事件的一系列相关数据的集合 跟事件相关的 比如鼠标点击里面就包含了鼠标的相关信息,鼠标坐标啊,如果是键盘事件里面就包含的键盘事件的信息 比如 判断用户按下了那个键
            // 4. 这个事件对象我们可以自己命名 比如 event 、 evt、 e
            // 5. 事件对象也有兼容性问题 ie678 通过 window.event 兼容性的写法  e = e || window.event;
        </script>
    </body>

    </html>
  • 相关阅读:
    prometheus 文档
    go
    nginx
    python使用xlrd读取合并单元格
    python使用xlrd模块读取Excel
    创建Excel文件:ModuleNotFoundError: No module named 'openpyxl'
    openpyxl模块安装时报错: You are using pip version 19.2.3, however version 20.0.2 is available. You should consider upgrading via the 'python -m pip install --upgrade pip' command.
    Python定义字典函数报错TypeError: takes 0 positional arguments but 1 was given
    Mysql--information_scherma(虚拟库)
    day07--MySQL索引
  • 原文地址:https://www.cnblogs.com/yanlei369343/p/13881754.html
Copyright © 2011-2022 走看看