引用案例:事件只能执行一次

array里面都是事件对象

点击box3区域时,则会有事件冒泡现象,即:box3响应后,box2(比他大一节)的区域,box1(比box2大一级)相应出现响应事件现象

捕获阶段:从外到内,(从大区域到小区域)

目标阶段:从内到外依次触发事件

false的意思在于事件是在捕获阶段还是目标阶段使用

事件委托:

举例:点击那个li,就是他这一行高亮显示

这个function参数中的e不是我们写的,这是系统在处理事件的时候的产物,this指向出发事件的函数,e指向真正触发事件的对象 ,而且我们也没有办法在事件触发的时候给这个函数传参数

但是IE9以前不支持这个e参数,在IE老版本的时候用的是window.event,IE9以后也支持这个,但是其他浏览器不一定支持,因此要做兼容性处理

用e=e || Window.event即可

遇到一个新的对象,就用console.dir()把他打印出来,来看她都有什么函数

以下是e的一些常用函数:

获取鼠标的位置:

body的区域是body内部元素的范围,如果页面内只有一个div,那body的范围就和div一样

上一种写法如果页面有滚动条就不对了,因为clientX和clientY是获取鼠标在可视范围内的位值,而不是页面内的位置

但是pageX在IE9之前并没有,因此就要去解决上一个clientX的问题了

而在这个问题上我们只需要把clientX加上页面滚动出去距离就可以了

滚动条属于窗口,因此可用window.scroll()来判断滚动条是否移动

scrollleft以及scrolltop是水平和竖直方向滚动条移动的距离

这个document.后面的东西有浏览器兼容问题

传参的时候就是传“e”(我们之前介绍过)

forEach在IE8不支持

取消默认行为的执行:

return false; 后续行为不会执行

e.preventDefauit();后面代码还会执行

是一些字符无法输入:(下例是不能输入a)

使其按回车时下一个文本框获取焦点

下一种方法是当按下回车时是回车对应的键改成tab对应键的ascall值,但是由于它是只读的,所以此方法不行

浏览器中的顶级对象:

在全局定义的变量和函数都是window下的变量和函数,即可用window.变量/函数()来调用

在window里面有一些属性,比如window的num或top在window中是string类型,你如果定义他为变量,那么无论你给他赋什么值,他始终是string类型

JavaScript——四的更多相关文章

  1. 初探JavaScript(四)——作用域链和声明提前

    前言:最近恰逢毕业季,千千万万的学生党开始步入社会,告别象牙塔似的学校生活.往往在人生的各个拐点的时候,情感丰富,感触颇深,各种对过去的美好的总结,对未来的展望.与此同时,也让诸多的老“园”工看完这些 ...

  2. Perl,Python,Ruby,Javascript 四种脚本语言比较

    Perl 为了选择一个合适的脚本语言学习,今天查了不少有关Perl,Python,Ruby,Javascript的东西,可是发现各大阵营的人都在吹捧自己喜欢的语言,不过最没有争议的应该是Javascr ...

  3. 从头开始学JavaScript (四)——操作符

    原文:从头开始学JavaScript (四)--操作符 一.一元操作符 1.自增自减操作符:分为前置型和后置型: 前置型:++a;--a; 后置型:a++;a--; 例: <script typ ...

  4. JavaScript四种数值取整方法

    一.Math.trunc() 1.定义 Math.trunc()方法去除数字的小数部分,保留整数部分. 2.语法 Math.trunc(value) 3.示例 console.log(Math.tru ...

  5. JavaScript(四) Window窗体操作

    window: 属性(值或者子对象):opener:打开当前窗口的源窗口,如果当前窗口是首次启动浏览器打开的,则opener是null,可以利用这个属性来关闭源窗口. 方法(函数):事件(事先设置好的 ...

  6. 数据结构与算法JavaScript (四) 串(BF)

    串是由零个或多个字符组成的有限序列,又叫做字符串 串的逻辑结构和线性表很相似的,不同的是串针对是是字符集,所以在操作上与线性表还是有很大区别的.线性表更关注的是单个元素的操作CURD,串则是关注查找子 ...

  7. javascript四种类型识别的方法

    × 目录 [1]typeof [2]instanceof [3]constructor[4]toString 前面的话 javascript有复杂的类型系统,类型识别则是基本的功能.javascrip ...

  8. javascript——四种函数调用形式

    此文的目的是分析函数的四种调用形式,弄清楚函数中this的意义,明确构造函对象的过程,学会使用上下文调用函数. 在JavaScript中,函数是一等公民,函数在JavaScript中是一个数据类型,而 ...

  9. JavaScript四(DOM编程)

    一.绪论 DOM是文档对象模型(Document Object Module)的简称,借助DOM模型,可以将结构化文档,转换成DOM树,程序可以访问,修改,增加,删除树的节点.程序通过操作DOM树时, ...

  10. 从零开始学JavaScript四(数据类型)

    一.分类 基本数据类型:undefined.null.string.Boolean.number 复杂数据类型:object object的属性以无序的名称和值对的形式 (name : value) ...

随机推荐

  1. kubernets之Replication Controller

    一  Replication Controller的介绍      pod可能会由于各种原因消失和多出来,例如node节点去除集群或者人为的手工创建,所以为了方便和管理pod的数量,k8s里面 的另外 ...

  2. me21n增强BADI:ME_PROCESS_PO_CUST之process_account

    当实施ME_PROCESS_PO_CUST这个badi来增强ME21N的时候,用了到方法process_account,既对ME21N的行项目的科目分配做增强.主要用到如下类: IF_PURCHASE ...

  3. Databricks 第9篇:Spark SQL 基础(数据类型、NULL语义)

    Spark SQL 支持多种数据类型,并兼容Python.Scala等语言的数据类型. 一,Spark SQL支持的数据类型 整数系列: BYTE, TINYINT:表示1B的有符号整数 SHORT, ...

  4. ichartjs测试dome分享

    效果如下: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> ...

  5. Nifi组件脚本开发—ExecuteScript 使用指南(一)

    Part 1 - 介绍 NiFi API 和 FlowFiles ExecuteScript 是一个万能的处理器,允许用户使用编程语言定义自己的数据处理功能, 在每一次 ExecuteScript p ...

  6. Web自动化测试python环境中安装 --selenium安装、火狐和火狐驱动版本、谷歌和谷歌驱动版本、测试

    一.安装selenium Windows命令行(cmd)输入pip install selenium(无须指定版本默认最新)或 pip install selenium==3.141.0(可指定版本) ...

  7. 策略模式 VS 状态模式

    策略模式 VS 状态模式 策略模式 VS 状态模式 | 菜鸟教程 https://www.runoob.com/w3cnote/state-vs-strategy.html

  8. namedtuple

    Python的namedtuple使用详解_kongxx的专栏-CSDN博客_namedtuple https://blog.csdn.net/kongxx/article/details/51553 ...

  9. URI与URL傻傻分不清楚?

    前言 总所周知,缓存是解决Http1.1协议传输性能的问题中最主要的手段. 缓存既可以存在于浏览器上,也可以存在于服务器中. 而影响缓存的Http头部有很多,其中Cache-Control是比较重要的 ...

  10. loj10018数的划分

    题目描述 将整数 n 分成 k 份,且每份不能为空,问有多少种不同的分法.当 n=7,k=3 时,下面三种分法被认为是相同的:1 1 5;1 5 1 ;5 1 1 输入格式 一行两个数 n ,k . ...