问:什么是事件?

答:JS创建动态页面,可以被JS侦测到的行为。网页中的每个元素都可以产生某些可以触发JS函数的事件。比如说,当用户点击按钮时,就发生一个鼠标单击(onclick)事件,需要浏览器做出处理。

onclick:鼠标点击事件

onmouseenter : 鼠标进入事件

onmouseout : 鼠标移开事件

onmouseover : 鼠标经过事件

onmousemove : 鼠标移动事件

onchange : 文本框内容改变事件

onselect : 文本框内容选中事件

onfocus : 光标聚焦事件

onblur : 光标失焦事件

onload : 网页导入事件

onunload : 关闭网页事件

事件流:

就是事件的流向,是根据什么路径走的

分为三个阶段:

捕获 --> 目标 --> 冒泡

JS 中支持两种事件机制:

1.捕获

2.冒泡

阻止冒泡:event.stopPropagation();

事件对象

什么是事件对象?在触发DOM上的事件时都会产生一个对象
1. type 属性 用于获取事件类型
2. target 属性 用于获取事件目标
3. stopPropagation()方法 用于阻止事件冒泡
4. preventDefault()方法 用于阻止事件默认行为
       <a href="#">超链接</a>

JS - 事件常用的更多相关文章

  1. js事件常用操作、事件流

    注册事件 给元素添加事件,称为注册事件或者绑定事件. 注册事件有两种方式:传统方式和方法监听注册方式 传统方式 on开头的事件,例如onclick <button onclick="a ...

  2. JS事件常用事件

    oncontextmenu对象右击 举例1: <form id="form1" name="form1" method="post" ...

  3. js事件绑定细节说明

    javascript绑定事件: 经常用jQuery去写,时间长了对原生态的js事件绑定的知识会慢慢淡化或者遗忘了,必须翻出来再次总结,今天再次把js原生态事件的处理做个总结. 从最初开始,谁刚接触ja ...

  4. Node.js 事件

    Node.js 事件 Node.js 所有的异步I/O 操作在完成时都会发送一个事件到事件队列. Node.js里面的许多对象都会分发事件:一个net.Server对象会在每次有新连接时分发一个事件, ...

  5. JS中的函数、Bom、DOM及JS事件

    本期博主给大家带来JS的函数.Bom.DOM操作,以及JS各种常用的数据类型的相关知识,同时,这也是JavaScript极其重要的部分,博主将详细介绍各种属性的用法和方法. 一.JS中的函数 [函数的 ...

  6. js事件流机制冒泡和捕获

    JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间. 事件流 从页面中接收事件的顺序称为事件流. IE --> 事件冒泡流 Netsc ...

  7. 基础篇:1.JavaScript运行在html中,引用有几种方式?—— 6.js中常用的输出方式?

    书接上文,上文提到若干条JavaScript的基础性知识,大部分都是一些概念性的东西,本着认真严谨的态度,我们要认真对待,有些条目的问题是某个知识点的周边延伸,为节约篇幅,就一起整理了,如有描述不对的 ...

  8. 深入浅出js事件

    深入浅出js事件 一.事件流 事件冒泡和事件捕获分别由微软和网景公司提出,这两个概念是为了解决页面中事件流(事件发生顺序)的问题. <div id="outer"> & ...

  9. C#-WebForm-JS知识:基础部分、BOM部分、DOM部分、JS事件

    一.基础部分: 1.JavaScript 是什么? 是一门脚本语言,是属于弱类型(语言语法很随意),C#是强类型(语言语法非常严格)(李献策lxc) 优点:JS 执行速度快 2.JS 与java有什么 ...

随机推荐

  1. feign微服务调用携带浏览器信息(header、cookie)

    import feign.RequestInterceptor; import feign.RequestTemplate; import org.apache.commons.collections ...

  2. selenium实战:窗口化爬取*宝数据(附源码链接)

    完整代码&火狐浏览器驱动下载链接:https://pan.baidu.com/s/1pc8HnHNY8BvZLvNOdHwHBw 提取码:4c08 双十一刚过,想着某宝的信息看起来有些少很难做 ...

  3. 基于echarts 24种数据可视化展示,填充数据就可用,动手能力强的还可以DIY(演示地址+下载地址)

    前言 我们先跟随百度百科了解一下什么是"数据可视化 [1]". 数据可视化,是关于数据视觉表现形式的科学技术研究. 其中,这种数据的视觉表现形式被定义为,一种以某种概要形式抽提出来 ...

  4. dart系列之:在dart中使用数字和字符串

    目录 简介 数字 字符串 StringBuffer 总结 简介 要想熟悉一种语言,最简单的做法就是熟悉dart提供的各种核心库.dart为我们提供了包括dart:core,dart:async,dar ...

  5. Hardware assisted virtualization and data execution protection must be enabled in the BIOS. See https://docs.docker.com/docker-for-windows/troubleshoot/#virtualization

    解决办法:先关闭 Hyper-V ,然后重新开启 Hyper-V 即可! 来自:https://zhuanlan.zhihu.com/p/51939654

  6. 洛谷 P7451 - [THUSCH2017] 杜老师(线性基+根分+结论题)

    题面传送门 看到乘积为平方数我们可以很自然地想到这道题,具体来说,我们对 \(1\sim 10^7\) 中所有质因子标号 \(1,2,\cdots,\pi(10^7)\),对于 \(x\in[l,r] ...

  7. CF1553 部分题解

    CF1553D Backspace 题目传送门. 题意简述:给定 \(s,t\),现在要依次输入 \(s\) 中的字符.对于每个字符 \(s_i\),你可以选择输入 \(s_i\) 或者使用退格键,判 ...

  8. #10471. 「2020-10-02 提高模拟赛」灌溉 (water)

    题面:#10471. 「2020-10-02 提高模拟赛」灌溉 (water) 假设只有一组询问,我们可以用二分求解:二分最大距离是多少,然后找到深度最大的结点,并且把它的\(k\)倍祖先的一整子树删 ...

  9. PAML 选择压力的计算

    简介 PAML(Phylogenetic Analysis by Maximum Likelihood)是伦敦大学的杨子恒(Yang Ziheng)教 授开发的一套基于最大似然估计来对蛋白质和核酸序列 ...

  10. 【数据处理】python将GO注释结果整理为WEGO文件

    通常,比对NR库后为m8格式,通过NR和GO数据库对应关系文件,写代码整理为Gene-->GO文件,如下: 这里是一对一的关系,要转换为WEGO格式文件,即一对多关系,如下: 用python脚本 ...