js中事件的3要素

  • 事件源
  • 事件
  • 事件处理程序

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style>

        #demo {

            width: 200px;

            height: 200px;

            background-color: pink;

        }

    </style>

</head>

<body>

<div id="demo"></div>

<button id="btn">改变宽度</button>

<script>

    /*要操作先找人*/

    var demo = document.getElementById("demo");  //获得id为demo的div盒子给demo

    var btn = document.getElementById("btn");    // 获得按钮

    /*事件三要素*/

    /*事件源.事件 = fucntion(){}*/

    btn.onclick = function(){

        console.log(this); // this表示btn

        demo.style.width = "400px";

    }

</script>

</body>

</html>

[js]js中事件的3要素的更多相关文章

  1. JS中事件代理与委托

    在javasript中delegate这个词经常出现,看字面的意思,代理.委托.那么它究竟在什么样的情况下使用?它的原理又是什么?在各种框架中,也经常能看到delegate相关的接口.这些接口又有什么 ...

  2. JS中事件绑定的三种方式

    以下是搜集的在JS中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="upl ...

  3. 项目遇到的小问题（关于vue-cli中js点击事件不起作用和iconfont图片下载页面css样式乱的解答）

     第一个:关于vue-cli中js点击事件不起作用 在vue的methods方法queryBtnFun()中拼接html和click操作事件的时候,发现点击事件一起未起作用: 后来发现是DOM执行顺序 ...

  4. 在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件

    在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件  当触发事件时候 会把当前的dom传给该方法

  5. js中事件三阶段

    js中事件三阶段 先贴代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  6. Vue.js 2.x中事件总线(EvevntBus)及element-ui中全屏loading的使用

    事件总线(Event Bus)可以在vue项目的index.js文件中创建,也可以在一个独立的.vue文件中创建.使用时,在各个子组件中引入该组件即可. 项目中的全屏loading较多时,可以在根组件 ...

  7. 服务器文档下载zip格式 SQL Server SQL分页查询 C#过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法（转载） IEnumerable,ICollection,IList接口问题 不吹不擂，你想要的Python面试都在这里了【315+道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理

    服务器文档下载zip格式   刚好这次项目中遇到了这个东西,就来弄一下,挺简单的,但是前台调用的时候弄错了,浪费了大半天的时间,本人也是菜鸟一枚.开始吧.(MVC的) @using Rattan.Co ...

  8. IOS的UIWebView中JS点击事件，需要加入cursor：pointer;属性才可以

    IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以. Android的WebView可以支持外链样式,js文件:IOS则需要改为内嵌样式和JS文件.

  9. 对JS中事件委托的理解

    什么是事件委托: 事件委托——给父元素绑定事件,用来监听子元素的冒泡事件,并找到是哪个子元素的事件.(不理解冒泡的可以去百度下) 定义:利用事件冒泡处理动态元素事件绑定的方法,专业术语叫事件委托. 使 ...

随机推荐

  1. MySQL主从复制作用和原理

    一.什么是主从复制?主从复制,是用来建立一个和主数据库完全一样的数据库环境,称为从数据库:主数据库一般是准实时的业务数据库. 二.主从复制的作用1.做数据的热备,作为后备数据库,主数据库服务器故障后, ...

  2. Python的浮点数损失精度问题

    本篇讨论的现象可以从下面这段脚本体现出来: >>> x = 0.0 >>> for i in range(10): x += 0.1 print(x) 0.1 0. ...

  3. [HDFS Manual] CH1 HDFS体系结构

    v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VM ...

  4. Ubuntu18.04提示wifi无法连接

    [时间:2018-07] [状态:Open] [关键词:Ubuntu 18.04,wifi,apt-get,mount] 0 现象描述及背景 最近需要一个Ubuntu的系统作为开发环境,随机下载了v1 ...

  5. 【Java】类加载过程

    JVM把class文件加载到内存,并对数据进行校验.解析和初始化,最终形成JVM可以直接使用的Java类型的过程. 类加载的过程主要分为三个部分: 加载 链接 初始化 而链接又可以细分为三个小部分: ...

  6. Oracle sql 统计

    1.按小时统计数量 SELECT TO_CHAR(RECEIVE_TIME,'HH24') HOUR ,COUNT(*) N FROM PH_PRESCRIPTION P WHERE TO_CHAR( ...

  7. 一次xxoo提权

    数据库root权限.然并卵. 看了一下phpinfo得知是mysql 5.0 的 然后想要通过udf之类的提权一波,结果一执行sql语句就被狗拦截了. 然而数据库这条路是GG了 OS 名称: Micr ...

  8. 会使用基本的Render函数后，就会想，这怎么用 v-for/v-if/v-model;我写个vue Render函数进阶

    https://blog.csdn.net/wngzhem/article/details/54291024

  9. linux搭建FTP服务器并整合Nginx

    操作系统:Centos7 1.1.服务器配置 # 关闭SELINUX,把SELINUX=enforcing改为SELINUX=disabled,reboot重启服务器生效 vim /etc/sysco ...

  10. MA5680T OLT管理软件，全智能判断板卡，无人值守策略，根据光猫类型自动扫描添加光猫

    轻量型的ONU查询工具,智能查询板卡,查询自动发现,搜索ONU等功能,需要更多智能功能,可联系QQ:561454825 下载地址:下载地址1