一、添加事件的方法

1、EventTarget.addEventListener添加

获取事件目标元素,通过addEventListener函数添加

// Assuming myButton is a button element
myButton.addEventListener('click', greet, false);
function greet(event){
    // print and have a look at the event object
    // always print arguments in case of overlooking any other arguments
    console.log('greet:', arguments);
    alert('hello world');
}

比较推荐,但要注意:Internet Explorer 6-8不支持此方法,提供类似的方法

2、HTML attribute 直接作为元素属性添加

<button onclick="alert('Hello world!')"

<button onclick="test()">

官方:这种方式不被推荐,使得标记变大,可读性低,内容结构和行为没有分离,出现bug很难发现。

3.DOM element properties 为元素添加属性

// Assuming myButton is a button element
myButton.onclick = function(event){alert('Hello world');};

此方法的问题是每个元素和每个事件只能设置一个处理程序。

二、常用的事件

js&jquery:添加事件的三种方法和常用的一些事件的更多相关文章

  1. js jquery 获取服务器控件的三种方法

    由于ASP.NET网页运行后,服务器控件会随机生成客户端id,jquery获取时候不太好操作,google了下,总结有以下3种方法: 服务器控件代码:<asp:TextBox ID=" ...

  2. js+jquery+html实现在三种不通的情况下,点击图片放大的效果

    js+jquery+html实现在三种不通的情况下,点击图片放大的效果. 三种情况分别是:图片的父元素宽高固定;  图片的宽高固定;  图片的父元素宽固定,高度不固定 第一种情况:图片的父元素宽高固定 ...

  3. mysql 中添加索引的三种方法

    原文:http://www.andyqian.com/2016/04/06/database/mysqleindex/ 在mysql中有多种索引,有普通索引,全文索引,唯一索引,多列索引,小伙伴们可以 ...

  4. js字符串转换为数字的三种方法。(转换函数)(强制类型转换)(利用js变量弱类型转换)

    js字符串转换为数字的三种方法.(转换函数)(强制类型转换)(利用js变量弱类型转换) 一.总结 js字符串转换为数字的三种方法(parseInt("1234blue"))(Num ...

  5. JS模拟实现封装的三种方法

      前  言  继承是使用一个子类继承另一个父类,那么子类可以自动拥有父类中的所有属性和方法,这个过程叫做继承!  JS中有很多实现继承的方法,今天我给大家介绍其中的三种吧. 1.在 Object类上 ...

  6. Second Day: 关于Button监听事件的三种方法(匿名类、外部类、继承接口)

    第一种:通过匿名类实现对Button事件的监听 首先在XML文件中拖入一个Button按钮,并设好ID,其次在主文件.java中进行控件初始化(Private声明),随后通过SetOnClickLis ...

  7. 安卓开发笔记(十八):实现button按钮事件的三种方法

    Android开发中有三种主要的方式用于设置View的点击事件,1.创建内部类:2.主类中实现OnClickListener接口:3.使用匿名内部类.这三种方式都用到了OnClickListener接 ...

  8. 【jQuery】初始化的三种方法

    JQ初始化方法实际上有两种,由于美元符号可以定义 jQuery,那么就有三种方法可以进行初始化操作,根据个人习惯来选择吧! 第一种 $(document).ready(function(){ // j ...

  9. js 与ios 交互的三种方法

    第一种:IOS拦截url  实现跳转 参考链接:http://www.cnblogs.com/pengyingh/articles/2354381.html IOS9.0 及以上支持 第二种:IOS ...

随机推荐

  1. Deffered.js的实现原理

    在艾伦的推荐下,看了一个日本人写的延时加载库,非常轻量,写的很棒.作为我的源码学习的第一编. 在认真看了两天之后,才看懂它的实现原理,我下面把通自己的理解,进行了精简.只程现原理,方便日后的回顾.&l ...

  2. 点击a标签,跳转到iframe中,并在iframe中显示指定的页面

    点击a标签,跳转到iframe中,并在iframe中显示指定的页面 1.用a标签的target属性 <iframe id="myFrameId" name="myF ...

  3. 全景VR视频外包公司:长年承接VR全景视频外包(技术分享YouTube的360全景视频)

    虽然比预期来得晚了些,但YouTube终于支持360度全景视频了,这应该会吸引不少VR(虚拟现实)爱好者.今年1月,Google就表示这一功能将在“接下来”的几周出现.现在YouTube上已经有了一些 ...

  4. HTML 块元素

    分为3类 1. 结构块 只能包含块级元素.它们包含结构含义,但没有语义含义,也就是,不能说明内容是什么,只能说明其组织方式. <ol> <ul> <dl> < ...

  5. iOS NSDictionary、NSData、JSON数据类型相互转换

    iOS经常需要用到数据类型的转换,下面列举一下常用类型的转换. 1.NSDictionary类型转换为NSData类型: //NSDictionary -> NSData: NSDictiona ...

  6. ubuntu14.04 解决屏幕亮度无法调节的问题

    sudo gedit /etc/default/grub 在打开文件中找到 GRUB_CMDLINE_LINUX="" 改成 GRUB_CMDLINE_LINUX="ac ...

  7. html基础复习

    1.标签选择器   div{}   2.类选择器   .one class="one"   3.id选择器(定义+调用)   #one{} id="one"   ...

  8. [Swift]LeetCode402. 移掉K位数字 | Remove K Digits

    Given a non-negative integer num represented as a string, remove k digits from the number so that th ...

  9. 2018—自学Selenium+Python 笔记(二)

    此文记录一些python语法不同之处.. 适合有研发基础的童鞋查阅.. 零基础的童鞋就怪怪一个个学吧! 记录也不一定全,随笔一记 多行语句 total=item1+\ item2+\ item3 &q ...

  10. python框架之Django(11)-中间件

    介绍 在django中,中间件其实就是一个类,在一个请求到来和这个请求结束之前,django会根据自己的规则在合适的时机执行中间件中相应的方法. 在django项目的settings模块中,有一个 M ...