js事件入门(1)
1.事件相关概念
1.1 什么是事件?
事件是用户在访问页面时执行的操作,也就是用户访问页面时的行为。当浏览器探测到一个事件时,比如鼠标点击或者按键。它可以触发与这个事件相关的JavaScript对象(函数),这些对象称为事件处理程序。
1.2 事件函数绑定
上面说到了,当浏览器检测到一个事件时,会触发相关的JavaScript对象(函数),这里的对象就是我们说的事件处理程序,或者叫作事件处理函数。不是每个事件都有对应的事件处理程序,要让某个事件触发后做出相应的处理,所以需要把事件和事件处理程序绑定。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload = function(){
//获取到按钮对象
var oBtn = document.getElementById('btn');
//oBtn的点击事件发生后,弹出一个1
oBtn.onclick = function(){
//这里弹出一个1就是事件发生后对应的操作
alert(1);
}
}
</script>
</head>
<body>
<input id="btn" type="button" value="按钮"/>
</body>
</html>
螺钉课堂视频课程地址:http://edu.nodeing.com
js事件入门(1)的更多相关文章
- js事件入门(2)
2.鼠标事件 鼠标事件就是用户与页面的许多交互时通过鼠标移动或者鼠标点击等触发的事件. 2.1.onmousedown 鼠标按下的时候触发的事件 <!DOCTYPE html> <h ...
- js事件入门(6)
7.事件冒泡机制 7.1.什么是事件冒泡 当一个元素接收到一个事件以后,会将事件传播给它的父级元素,它的负级元素会一层一层往上传播,直到最顶层window,这种事件传播机制叫作事件冒泡. <!D ...
- js事件入门(5)
5.窗口事件 5.1.onload事件 元素加载完成时触发,常用的就是window.onload window.onload = function(){ //等页面加载完成时执行这里的代码 } 5.1 ...
- js事件入门(4)
4.表单事件 表单事件处理主要用来验证表单,可以处理用户在表单上所做的任何操作. 4.1.onsubmit事件 当用户点击submit按钮来提交表单时,就会触发onsubmit事件,如果事件处理程序返 ...
- js事件入门(3)
3.键盘事件 3.1.onkeydown 键盘按下事件 当键盘按下的时候触发 <!DOCTYPE html> <html> <head> <meta char ...
- Node.js快速入门
Node.js是什么? Node.js是建立在谷歌Chrome的JavaScript引擎(V8引擎)的Web应用程序框架. 它的最新版本是:v0.12.7(在编写本教程时的版本).Node.js在官方 ...
- 第一百一十九节,JavaScript事件入门
JavaScript事件入门 学习要点: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操 ...
- Node.js开发入门—HelloWorld再分析
在Node.js开发入门(1)我们用http模块实现了一个简单的HelloWorld站点,这次我们再来细致分析下代码.了解很多其它的细节. 先看看http版本号的HelloWorld代码: 代码就是这 ...
- Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二)
Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二) 前言 上篇文章对Vue.js有了初步理解,接下来我们把Vue.js基础语法快速的过一遍,先混个脸熟留个印象就 ...
随机推荐
- ES6背记手册
ES6规范 阮一峰的ES6在线教程 在线图书--Exploring ES6 ES6 tutorials babel在线教程--https://babeljs.io/docs/en/learn.html ...
- Python编程思想(3):数字及其相关运算
Python 提供了三种数值类型:int(整型),float(浮点型)和complex(复数). int:通常被称为整型或者整数,如200.299.10都属于整型: float:浮点数包含整数和小数部 ...
- Java实现 洛谷 P1000 超级玛丽游戏
public class Main { public static void main(String[] args){ System.out.println(" ********" ...
- 二叉树路径搜索---DFS 路径和
vector<vector<int>> pathSum(TreeNode* root,int sum){//DFS遍历获取适合路径,当递归到叶子结点且sum为0,表示该路径合适 ...
- 【Spring注解驱动开发】使用@Lazy注解实现懒加载
写在前面 Spring在启动时,默认会将单实例bean进行实例化,并加载到Spring容器中.也就是说,单实例bean默认在Spring容器启动的时候创建对象,并将对象加载到Spring容器中.如果我 ...
- Spring-AOP之工作实践(二)
案例二.前端页面权限控制 对controllor控制器中的某写方法进行增强,如实现页面的按钮权限控制. /** * 保存session的容器 */ public class SessionContex ...
- IP 代理池
https://github.com/jhao104/proxy_pool 安装依赖 pip install -r requirements.txt 配置 Config/setting.py # Co ...
- 小程序-图片/文件本地缓存,减少CDN流量消耗
写在前面 小程序网络图片读取: 在读取OSS图片CDN分发时流量大量消耗,导致资金费用增加. 网络图片比较大时,图片加载缓慢. 为了尽量减少上面两个问题,所以对已读的图片进行缓存处理,减少多次访问不必 ...
- pytorch入门2.0构建回归模型初体验(数据生成)
pytorch入门2.x构建回归模型系列: pytorch入门2.0构建回归模型初体验(数据生成) pytorch入门2.1构建回归模型初体验(模型构建) pytorch入门2.2构建回归模型初体验( ...
- Java 多线程基础(四)线程安全
Java 多线程基础(四)线程安全 在多线程环境下,如果有多个线程在同时运行,而这些线程可能会同时运行这段代码.程序每次运行结果和单线程运行的结果是一样的,而且其他的变量的值也和预期的是一样的,就是线 ...