ie和chrome,firefox的事件处理,除了函数名字不同,基本大同小异。这样就已chrome为主了,对ie有兴趣的自己去百度。jquery已经处理不同浏览器兼容性问题,推荐使用。

事件处理有两种常用方法,一种通过标签的onXXX属性,第二种是给标签(元素)添加事件监听器,下面已给出实例:

  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5. <meta charset="utf-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. <title>js event</title>
  8. </head>
  9.  
  10. <body>
  11.  
  12. <button onclick="clickMe()">Click Me</button>
  13. <button id="getTimeBtn">Get Time</button>
  14.  
  15. <script>
  16. //处理clickMe
  17. function clickMe() {
  18. alert('you clicked me !');
  19. }
  20. </script>
  21.  
  22. <script>
  23. //获取btnEle元素
  24. var btnEle = document.getElementById('getTimeBtn');
  25. //为点击事件添加监听器
  26. btnEle.addEventListener('click', function () {
  27.  
  28. alert(new Date());
  29.  
  30. });
  31. /*
  32. 注意,这段代码必须放在getTimeBtn下面,否则将出错,因为如果放在getTimeBtn上面,
  33. 程序从上向下执行,document.getElementById('getTimeBtn')返回的将是
  34. undefined,这是初学者常见的错误。此外,还有一种方法,就是当文档加载完了,
  35. 去添加事件监听器,这个事件叫onload, 这里作为作业了。
  36. */
  37. </script>
  38. </body>
  39.  
  40. </html>

Javascrpt 速成篇】 三:js事件处理的更多相关文章

  1. 【Javascrpt 速成篇】 一:js基础

     本系列文章Javascript一律简称js,javascript太长了((⊙﹏⊙)b) js概述 js是面向对象和基于事件驱动的解释型语言,主要用于WEB前端,处理用户交互.几年前js只是作为一种前 ...

  2. Javascrpt 速成篇】 二:js面向对象

    现实世界的对象由形态和行为组成,js中对应的是属性和函数. <!DOCTYPE html> <html> <head> <meta charset=" ...

  3. JavaScript筑基篇(三)->JS原型和原型链的理解

    删除理由:很久以前写的,当时理解不够深入,这样描述反而看起来更复杂了.因此就删掉,免得误人子弟! 可以看看另一篇文章:[如何继承Date对象?由一道题彻底弄懂JS继承.](http://www.cnb ...

  4. 【基于WinForm+Access局域网共享数据库的项目总结】之篇三:Access远程连接数据库和窗体打包部署

    篇一:WinForm开发总体概述与技术实现 篇二:WinForm开发扇形图统计和Excel数据导出 篇三:Access远程连接数据库和窗体打包部署 [小记]:最近基于WinForm+Access数据库 ...

  5. 【基于WPF+OneNote+Oracle的中文图片识别系统阶段总结】之篇三:批量处理后的txt文件入库处理

    篇一:WPF常用知识以及本项目设计总结:http://www.cnblogs.com/baiboy/p/wpf.html 篇二:基于OneNote难点突破和批量识别:http://www.cnblog ...

  6. js事件处理 —— 详解

    对于JS事件处理分为四部分: 1.html事件处理程序 直接添加到HTML结构中 解析:用html处理程序可以直接在button元素里直接调用,但是维护性不是很方便 <!DOCTYPE html ...

  7. 【SSRS】入门篇(三) -- 为报表定义数据集

    原文:[SSRS]入门篇(三) -- 为报表定义数据集 通过前两篇文件 [SSRS]入门篇(一) -- 创建SSRS项目 和 [SSRS]入门篇(二) -- 建立数据源 后, 我们建立了一个SSRS项 ...

  8. js事件处理-整理

    <!-- 作者:gentiana@163.com 时间:2016-3-10 描述:js事件处理 --> <!DOCTYPE html> <html> <hea ...

  9. Vue.js事件处理

    Vue.js事件处理 1.v-on指令 用法如下:使用v-on:指令指定其执行的具体内容或者方法名即可. <button v-on:click='num++'>giao</butto ...

随机推荐

  1. nmap 端口扫描王,查看端口是否可访问,是否对外开放

    NMap,也就是Network Mapper,最早是Linux下的网络扫描和嗅探工具包. 1 安装 apt-get install nmap 2 使用,查看ip下所有对外的端口 $ sudo nmap ...

  2. 十五 web爬虫讲解2—urllib库中使用xpath表达式—BeautifulSoup基础

    在urllib中,我们一样可以使用xpath表达式进行信息提取,此时,你需要首先安装lxml模块,然后将网页数据通过lxml下的etree转化为treedata的形式 urllib库中使用xpath表 ...

  3. idea maven install时,打包找不到微服务common中公用的包

    如题:其实很简单,在打包之前要先使项目通过编译,编译通过之后再打包就可以了. 附idea编译键:

  4. Hibernate入门_增删改查

    一.Hibernate入门案例剖析:  ①创建实体类Student 并重写toString方法 public class Student { private Integer sid; private ...

  5. IOS-CocoaPods的详细安装与使用

    1.为什么需要CocoaPods 在进行iOS开发的时候,总免不了使用第三方的开源库,比如SBJson.AFNetworking.Reachability等等.使用这些库的时候通常需要: 下载开源库的 ...

  6. Oracle 反应太后知后觉了.

    很久已经提过一个SR,关于BES一个用户可以用两个密码登陆EBS系统的问题,但是SR解决太慢,而且一致强调你们的版本太低,需要升级到最新的版本,考虑客户化的问题,我们的版本没有升级(R2.1.1),无 ...

  7. zen cart 空白页面的解决方案

    在安装zen cart 这套CMS时, 有时候会由于修改了某些页面或者是由于环境的某些组件的版本问题导致前台页面出现空白页, 由于在空白页面处没有任何提示, 并且在日志中也没有这样的出错提示, 导致在 ...

  8. Mutations

    蛤蟆可以吃队友,也可以吃对手. 如果数组第一个字符串元素包含了第二个字符串元素的所有字符,函数返回true. 举例,["hello", "Hello"]应该返回 ...

  9. IE中的if语句--实现不同版本IE浏览器不同html代码 (转)

    在很多html代码中常常可以看到很多的IE的条件语句,有时候很不明白他们的意思,其实这是为了能与低版本浏览器实现更好的兼容,例如在制作纯CSS的级联菜单时,由于在IE6中只有<a>支持伪类 ...

  10. I/O流+统计文件词频

    body, table{font-family: 微软雅黑; font-size: 10pt} table{border-collapse: collapse; border: solid gray; ...