JS 学习笔记--JS中的事件对象基础
事件:JavaScript中的事件是由访问web页面用户的一系列操作引起的,比如点击鼠标,键盘按键等。当用户执行某些操作的时候再去执行一些代码。
事件模型:内联模型、脚本模型、DOM2模型
内联模型:事件处理函数是html元素的一个属性,即把事件处理函数代码写在html文件中
//在HTML中把事件处理函数作为属性来执行JS代码
<div id="d1" onclick="alert('事件函数')">测试DIV</div> //注意其中的单双引号
<div id="d1" onclick="box()">测试DIV</div>
//PS: 不能够将box函数放在window.onload中,否则就看不到这个函数
脚本模型:内联模型违反了HTML和JS代码分离的原则,所有可以再JS中处理事件,就是脚本模型 脚本模型中首先是通过DOM来获得元素,然后给元素绑定事件处理函数: 元素名.事件处理函数名 = 绑定的函数名
绑定函数的时候,有两种方法,一种是绑定匿名函数,box.onclick = function(){};
一种是绑定外部通用函数,box.oncclick = click;这种模式中注意,后面是赋值click函数的函数名,是没有添加括号的,如果添加了括号就是执行函数而不是绑定函数(注册函数)
事件处理函数分为三类:鼠标点击事件,键盘按键事件,HTML事件;每一个事件都有自己的触发范围,如果超出了这个范围,就不会起作用
|
JS 学习笔记--JS中的事件对象基础的更多相关文章
- node.js学习笔记(三)——事件循环
要理解事件循环,首先要理解事件驱动编程(Event Driven Programming).它出现在1960年.如今,事件驱动编程在UI编程中大量使用.JavaScript的一个主要用途是与DOM交互 ...
- JS学习笔记9之event事件及其他事件
-->鼠标事件-->event事件对象-->默认事件-->键盘事件(keyCode)-->拖拽效果 一.鼠标事件 onclick ---------------鼠标点击事 ...
- JS学习笔记(四)常用对象
Error // 语法 throw new Error("消息"); 类似于C#中的Exception对象 // alert(num); try { throw new Error ...
- 《C#高级编程》学习笔记------C#中的事件和委托
本文转载自张子阳 目录 委托的作用 将方法绑定到委托 事件的来由 Observer设计模式 .Net Framework中的委托与事件 引言 委托 和 事件在 .Net Framework中的应用 ...
- JS学习笔记-OO创建怀疑的对象
问了.工厂介绍,解决重码 前面已经提到,JS中创建对象的方法.不难发现,主要的创建方法中,创建一个对象还算简单,假设创建多个类似的对象的话就会产生大量反复的代码. 解决:工厂模式方法(加入一个专门创建 ...
- Node.js学习笔记(三): 事件机制
大部分的nodejs核心api都建立在异步的事件驱动架构之上,所以events是Node.js 最重要的模块,它提供了唯一的接口.events 模块不仅用于用户代码与 Node.js 下层事件循环的交 ...
- Node.js学习笔记(四): 全局对象
在浏览器 JavaScript 中,通常 window 是全局对象, 而 Node.js 中的全局对象是 global,所有全局变量(除了 global 本身以外)都是 global 对象的属性. 这 ...
- 【JS学习笔记】提取行间事件
行间提取事件第一种方法: function 名字() { ... } oBtn.onclick=名字: 第二种方法: oBtn.onclick=function () { ... } 其实在JS当中, ...
- js学习笔记----JavaScript中DOM扩展的那些事
什么都不说,先上总结的图~ Selectors API(选择符API) querySelector()方法 接收一个css选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null ...
随机推荐
- IOS基础——IOS学习路线图(一)
一.一个月 1.OC语法基础. 2.KVC和KVO 3.IOS UI基础 4.UI表视图与集合视图 5.UIStoryboard和autoLayout 6.Ipad API 二.10天 7.静态页面考 ...
- php的swoole扩展中onclose和onconnect接口不被调用的问题
在用swoole扩展写在线聊天例子的时候遇到一个问题,查了不少资料,现在记录于此. 通过看swoole_server的接口文档,回调注册接口on中倒是有明确的注释: * swoole_server-& ...
- 傅里叶变换 fft_generic halcon
傅立叶变换(FT, Fourier Transform)的作用是将一个信号由时域变换到频域.其实就是把数据由横坐标时间.纵坐标采样值的波形图格式,转换为横坐标频率.纵坐标振幅(或相位)的频谱格式.变换 ...
- spark 集合交集差集运算
intersect except是spark提供的集合差集运算, 但是要求参与运算的两个dataframe,有相同的data Schema. 如果我想从 集合1(attribute1, attribu ...
- Learning Scrapy笔记(六)- Scrapy处理JSON API和AJAX页面
摘要:介绍了使用Scrapy处理JSON API和AJAX页面的方法 有时候,你会发现你要爬取的页面并不存在HTML源码,譬如,在浏览器打开http://localhost:9312/static/, ...
- Python学习教程(learning Python)--1.2.2 Python格式化输出基础
本节讨论为何要格式化输出数据? 先看一段代码吧,本程序的功能是计算月支付金额. amount_due = 5000.0 #年支付金额 monthly_payment = amount_due / 12 ...
- 【微信平台&后台管理】第一个外包项目:XX科技城微信平台项目总结
苍天有眼啊,学了半年的网站开发终于派上用处,终于能赚钱了啊. 这个项目是和学长一起做的,项目的甲方是大庆某房地产土豪,项目要求就是搭建一整套的微信平台和微信平台管理系统,具体要求就是:回复关键字能拿到 ...
- App创意项目助跑计划
APP创意项目助跑计划 该计划旨在帮助同学们将各种脑中稀奇古怪的想法借助互联网/移动互联网 相关的技术变成真实的项目. 谱写你的故事,从此刻开始! 我们帮助你提高编程(Java.C++.Objecti ...
- .net 高效管理稀缺资源(数据库资源,文件资源等)
MSDN建议按照下面的模式实现IDisposable接口: public class Foo: IDisposable { public void Dispose() { Dispose(true); ...
- golang实现ping命令
// Copyright 2009 The Go Authors. All rights reserved.// Use of this source code is governed by a B ...