JavaScript要点（十三） HTML DOM EventListener
addEventListener() 方法
<body> <p>该实例使用 addEventListener() 方法在按钮中添加点击事件。 </p>
<button id="myBtn">点我</button>
<p id="demo"></p>
<script>
document.getElementById("myBtn").addEventListener("click", displayDate);
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script> </body>
addEventListener() 方法用于向指定元素添加事件句柄。
addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。
你可以向一个元素添加多个事件句柄。
你可以向同个元素添加多个同类型的事件句柄，如：两个 "click" 事件。
你可以向任何 DOM 对象添加事件监听，不仅仅是 HTML 元素。如： window 对象。
addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。
当你使用 addEventListener() 方法时, JavaScript 从 HTML 标记中分离开来，可读性更强， 在没有控制HTML标记时也可以添加事件监听。
你可以使用 removeEventListener() 方法来移除事件的监听
语法
element.addEventListener(event, function, useCapture);
第一个参数是事件的类型 (如 "click" 或 "mousedown").
第二个参数是事件触发后调用的函数。
第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
JavaScript要点（十三） HTML DOM EventListener的更多相关文章
- 吴裕雄--天生自然 JAVASCRIPT开发学习：DOM EventListener
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- JavaScript HTML DOM EventListener
JavaScript HTML DOM EventListener addEventListener() 方法 实例 点用户点击按钮时触发监听事件: document.getElementById(& ...
- javascript 要点
javascript 要点 1 JavaScript:写入 HTML 输出 document.write("<h1>This is a heading</h1>&qu ...
- JavaScript之旅（DOM）
JavaScript之旅(DOM) [TOC] 一.认识DOM 什么是 DOM? DOM 是 Document Object Model(文档对象模型)的缩写. DOM 是 W3C(万维网联盟)的标准 ...
- JavaScript(第十八天)【DOM基础】
学习要点: 1.DOM介绍 2.查找元素 3.DOM节点 4.节点操作 DOM(Document Object Model)即文档对象模型,针对HTML和XML文档的API(应用程序接口).DOM描绘 ...
- JavaScript大杂烩10 - 理解DOM
操作DOM 终于到了JavaScript最为核心的部分了,通常来说,操作DOM,为页面提供更为友好的行为是JavaScript根本目标. DOM树 - HTML结构的抽象 既然DOM是操纵HTML ...
- 第一百四十一节，JavaScript，封装库--DOM加载
JavaScript,封装库--DOM加载 DOM加载,跨浏览器封装DOM加载,当网页文档结构加载完毕后执行函数,不等待图片音频视频等文件加载完毕 /** dom_jia_zai()函数,DOM页面加 ...
- JavaScript的BOM和DOM
JavaScript的BOM和DOM 1,window对象,所有浏览器都支持window对象,它表示浏览器窗口 BOM(browser Object Model)是指浏览器对象模型,它使JavaScr ...
- JavaScript之BOM和DOM
前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我们需要继续学习BOM和DO ...
- 8.6 JavaScript之HTML的DOM（三）
8.5 HTML和JavaScript的DOM(三) 一.DOM 是Document Object Model( 文档对象模型 )的缩写. DOM把所有的html都转换为节点 .整个文档 是一个节点 ...
随机推荐
- git commit 之后 push 之前，想删除 个别的commit 文件
git rm --cached <file_name> git commit "删除了<file_name>文件" git rm --cached < ...
- HTML5学习(四)---Canvas绘图
参考教程地址:http://www.w3school.com.cn/html5/html_5_canvas.asp canvas 元素用于在网页上绘制图形. 什么是 Canvas? HTML5 的 c ...
- oralce索引和分区索引的使用
oracle分区表和分区索引的本质就是将数据分段存储,包括表和索引(索引从本质上来讲也是表),表分区会将表分成多个段分别存储.由此数据查询过程改变为先根据查询条件定位分区表,然后从该表中查询数据,从而 ...
- Anti-pattern（反面模式）
转自维基百科 http://zh.wikipedia.org/wiki/%E5%8F%8D%E9%9D%A2%E6%A8%A1%E5%BC%8F 在软件工程中,一个反面模式(anti-pattern或 ...
- [LOJ 1248] Dice (III)
G - Dice (III) Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%lld & %llu Descri ...
- ASP.NET程序中动态修改web.config中的设置项目（后台CS代码）
using System;using System.Collections;using System.ComponentModel;using System.Data;using System.Dra ...
- Azure 中的多个 VM NIC 和网络虚拟设备
YU-SHUN WANG Azure 网络高级项目经理 在 2014 年欧洲 TechEd 大会上,我们宣布了在Azure VM 中为多个网络接口 (NIC) 提供支持,并与多家重要厂商合作,在 Az ...
- JVM的参数设置与OutOfMemoryError异常关系
Java堆中存放Object对象数据,例如new出来的Object.当没有任何引用指向某对象时,该对象可能被垃圾回收.有关垃圾回收算法,可参考其他有关文章,网上很多.关于对象引用,按强弱还有强引用,软 ...
- Java [leetcode 32]Longest Valid Parentheses
题目描述: Given a string containing just the characters '(' and ')', find the length of the longest vali ...
- EF的表连接方法Include() - nlh774
在EF中表连接常用的有Join()和Include(),两者都可以实现两张表的连接,但又有所不同. 例如有个唱片表Album(AlbumId,Name,CreateDate,GenreId),表中含外 ...