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 ...
随机推荐
- angularJS 数组更新时重新排序之解决方案一:这个坑,绕开吧,不跳了……
今天产品大人发现了一bug,图表数据和数据库总是对不上,原因是当前端更新数组时,angularJS默认对数组进行了排序. // 点击事件:input复选框 $scope.fnClickUpdateAr ...
- 学习jQuery在表单信息修改之中的常用方法;
submitHandler: function (form) { var parm = $("#myform").serialize(); var url = $("#m ...
- php使用swoole实现一个简单的多人在线聊天群发
聊天逻辑的好多细节没有实现,只实现群发. php代码: $serv = new swoole_websocket_server("127.0.0.1",3999); //服务的基本 ...
- 配置《算法 第四版》的Eclipse开发环境
1. 安装JAVA JAVA网址:http://www.oracle.com/technetwork/java/javase/downloads/index.html 配置环境变量(我把JAVA安装在 ...
- Keil的使用方法 - 常用功能(二)
Ⅰ.概述 上一篇文章是总结关于Keil使用方法-常用功能(一),关于(文件和编译)工具栏每一个按钮的功能描述和快捷键的使用. 我将每一篇Keil使用方法的文章都汇总在一起,回顾前面的总结请点击下面的链 ...
- python encode decode unicode区别及用法
decode 解码 encode 转码 unicode是一种编码,具体可以百度搜 # coding: UTF-8 u = u'汉' print repr(u) # u'\u6c49' s = u.en ...
- 自学Python三 Python中的屠龙刀(续)
装饰器: 在函数代码功能运行期间动态增加功能的方式叫做装饰器(Decorator).它对一个函数或者类进行再加工. 我们先定义两个函数,一个计算两数和,一个计算两数差. >>> de ...
- eval和new Function的区别
eval和new Function都可以动态解析和执行字符串.但是它们对解析内容的运行环境判定不同. var a = 'global scope' function b(){ var a = 'loc ...
- 多线程基本概论multithread
多线程 基本概念 进程 进程是指在系统中正在运行的一个应用程序 每个进程之间是独立的,每个进程均运行在其专用且受保护的内存空间内 通过 活动监视器 可以查看 Mac 系统中所开启的进程 线程 进程要想 ...
- oracle 日志文件管理
OS: [root@b28-122 ~]# more /etc/oracle-releaseOracle Linux Server release 5.7 DB: SQL> select * f ...