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）的更多相关文章

  1. js事件入门（2）

    2.鼠标事件 鼠标事件就是用户与页面的许多交互时通过鼠标移动或者鼠标点击等触发的事件. 2.1.onmousedown 鼠标按下的时候触发的事件 <!DOCTYPE html> <h ...

  2. js事件入门（6）

    7.事件冒泡机制 7.1.什么是事件冒泡 当一个元素接收到一个事件以后,会将事件传播给它的父级元素,它的负级元素会一层一层往上传播,直到最顶层window,这种事件传播机制叫作事件冒泡. <!D ...

  3. js事件入门（5）

    5.窗口事件 5.1.onload事件 元素加载完成时触发,常用的就是window.onload window.onload = function(){ //等页面加载完成时执行这里的代码 } 5.1 ...

  4. js事件入门（4）

    4.表单事件 表单事件处理主要用来验证表单,可以处理用户在表单上所做的任何操作. 4.1.onsubmit事件 当用户点击submit按钮来提交表单时,就会触发onsubmit事件,如果事件处理程序返 ...

  5. js事件入门（3）

    3.键盘事件 3.1.onkeydown 键盘按下事件 当键盘按下的时候触发 <!DOCTYPE html> <html> <head> <meta char ...

  6. Node.js快速入门

    Node.js是什么? Node.js是建立在谷歌Chrome的JavaScript引擎(V8引擎)的Web应用程序框架. 它的最新版本是:v0.12.7(在编写本教程时的版本).Node.js在官方 ...

  7. 第一百一十九节，JavaScript事件入门

    JavaScript事件入门 学习要点: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操 ...

  8. Node.js开发入门—HelloWorld再分析

    在Node.js开发入门(1)我们用http模块实现了一个简单的HelloWorld站点,这次我们再来细致分析下代码.了解很多其它的细节. 先看看http版本号的HelloWorld代码: 代码就是这 ...

  9. Vue.js+vue-element搭建属于自己的后台管理模板：Vue.js快速入门（二）

    Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二) 前言 上篇文章对Vue.js有了初步理解,接下来我们把Vue.js基础语法快速的过一遍,先混个脸熟留个印象就 ...

随机推荐

  1. java调用linux下的so库

    1.编写java类 public class Abc { static { System.loadLibrary("abc"); } public native static St ...

  2. （十）HTTP.sys远程代码执行

    01 漏洞描述 上篇文章介绍了Host头攻击,今天我们讲一讲HTTP.sys远程代码执行漏洞. HTTP.sys是Microsoft Windows处理HTTP请求的内核驱动程序,为了优化IIS服务器 ...

  3. set基本运用

    /* set集合基本用法 */ #include<iostream> #include<set> using namespace std; //set<T>a; v ...

  4. Centos7.x RPM安装ELK 7.5.0

    一.环境介绍   单位需要分析tomcat 日志和业务日志,比较以后还是选择用ELK 来进行日志的分析,以及可视化的展示. 系统环境 服务器: 1.AWS EC2 2C8G [root@ip-10-0 ...

  5. mac 排查被占端口

    Last login: Wed Sep :: on ttys000 sam:~ sam$ sudo lsof -i : Password: COMMAND PID USER FD TYPE DEVIC ...

  6. Remap 后的 USART1 不能发送数据

    最近在使用 STM32 的 USART1 时,遇到一点问题,记录一下. 如果 USART1 不是使用 PA9 和 PA10 作接收和发送引脚,而是 PB6 和 PB7,那么有一点就一定得注意了:此时 ...

  7. webtatic源

    我们在安装php时,系统的yum源中php版本太老,但是编译安装又太烦,这时我们可以使用webtatic源来yum安装较新版本的php. webtatic源: https://mirror.webta ...

  8. （八）MySQL事务、视图、变量、存储过程、函数、流程控制结构

    补充:增删查改语句在数据库中基本通用,但这篇博客的内容基本是MySQL区别于其它数据库管理系统的知识,也要认真学习. 一.事务 1.含义:在MySQL中,可以通过创建事务来解决一些问题. 2.语法: ...

  9. @Results用法总结

    MyBatis中使用@Results注解来映射查询结果集到实体类属性. (1)@Results的基本用法.当数据库字段名与实体类对应的属性名不一致时,可以使用@Results映射来将其对应起来.col ...

  10. mysql字符串类型（枚举类型）

    原文链接:https://blog.csdn.net/qq_34530405/article/details/81738907 本文记录MySql数据库中enum类型数据的使用细节和注意事项. 首先在 ...