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. grokking deep learning

    https://www.manning.com/books/grokking-deep-learning?a_aid=grokkingdl&a_bid=32715258

  2. JS 日期补0

    js日期需要yyyy-mm-dd的时候只显示yyyy-m-d,需要前面补充0,之前都是用的判断,感觉非常low.刚刚看到一个方法padStart用了用还不错,padStart是为数值补全指定位数,对应 ...

  3. Visual Studio编辑器“智能提示(IntelliSense)”异常的解决方案

    1.删除工程中的 .suo 文件. 2.重启vs

  4. 再杀掉app之后 删除NSUserDefault存在本地的数据

    这两天在处理  app退出后删除本地数据  在appDelegate里的这个函数里设置发现进不去 - (void)applicationWillTerminate:(UIApplication*)ap ...

  5. .NET EntityFrameworkCore.DbUpdateException 错误

    Microsoft.EntityFrameworkCore.DbUpdateException: An error occurred while updating the entries. See t ...

  6. spring源码：学习线索

    一.spring xml配置(不包括AOP,主要了解在初始化及实例化过程中spring配置文件中每项内容的具体实现过程,从根本上掌握spring) <bean>的名字 &,alia ...

  7. SAP Brazil J1BTAX 为税收例外创建税收组（翻译）

    很多人对如何维持巴西的税收仍有疑问.前段时间,一家有几个税务问题的公司联系我帮助他们,我发现多年来,由于他们的税务计算系统缺少配置,他们正在进行手动调整. 维持税收的第一条规则是: TAXBRJ = ...

  8. Windows Server 2003下DHCP服务器的安装与简单配置图文教程

    在前面的内容中,我们提到了DHCP这个词,为什么要用到DHCP呢,企业里如果有100台计算机,那样,我们一台台的进行配置Ip,我想还是可以的,因为少嘛,如果成千上万台,那我们也去一台台的配置,我相信这 ...

  9. swiper4自动轮播切换手动触碰后停止踩坑——属性disableOnInteraction

    swiper4轮播设置autoplay自动切换后,即默认设置: <script> var mySwiper = new Swiper('.swiper-container', { auto ...

  10. 自己动手实现RPC

    一.需求:用户管理系统(UMS),仓库管理系统(WMS),订单管理系统(OMS) 现在OMS有一张订单表:[订单id,用户id,商品id,订单状态,订单时间],需要在客户端展示此订单对应的用户详情和商 ...