5.15正则表达式
# 一、事件复习
1. 事件的组成,赋值式绑定事件举例
- obox.onclick = function(eve){}
- obox:事件源
- on:绑定事件的方式
- click:事件类型
- function:事件处理函数
- eve:事件对象,有兼容,需要主动获取
1. 事件的组成,赋值式绑定事件举例
- obox.onclick = function(eve){}
- obox:事件源
- on:绑定事件的方式
- click:事件类型
- function:事件处理函数
- eve:事件对象,有兼容,需要主动获取
2. 事件对象的获取方式
- var e = eve || window.event;
- var e = eve || window.event;
3. 事件对象身上的属性
- 鼠标类
- 坐标类...
- button:配合鼠标的按下事件,检测鼠标的按键
- 键盘类
- var kc = e.keyCode || e.which
- 功能键....
- 元素类
- var tgt = e.target || e.srcElement;
- 阻止冒泡
- 阻止默认
- 默认事件:没有写,自己有
- 什么时候需要阻止,阻止谁?
- 谁有,阻止谁
- 鼠标类
- 坐标类...
- button:配合鼠标的按下事件,检测鼠标的按键
- 键盘类
- var kc = e.keyCode || e.which
- 功能键....
- 元素类
- var tgt = e.target || e.srcElement;
- 阻止冒泡
- 阻止默认
- 默认事件:没有写,自己有
- 什么时候需要阻止,阻止谁?
- 谁有,阻止谁
4. 事件流的顺序
- 捕获 -> 目标 -> 冒泡
- ie没有捕获,只有冒泡
- 而且所有浏览器默认都是冒泡状态
- 捕获需要使用事件监听式绑定事件方法,触发
- 捕获:从外向内,从根元素到目标元素
- 冒泡:从内向外,从目标元素到根元素
- 捕获 -> 目标 -> 冒泡
- ie没有捕获,只有冒泡
- 而且所有浏览器默认都是冒泡状态
- 捕获需要使用事件监听式绑定事件方法,触发
- 捕获:从外向内,从根元素到目标元素
- 冒泡:从内向外,从目标元素到根元素
5. 绑定事件的方式
- 赋值式
- obox.onclick = function(){}
- 0兼容,不能重复绑定,只能冒泡
- 删除:obox.onclick = null;
- 监听式
- obox.addEventListener("click",function(){},false)
- 有兼容,能重复绑定,最后一个参数控制冒泡 或 捕获
- 兼容处理
- 正常:addEventListener
- IE:attachEvent
- 删除方式
- 正常:removeEventListener
- IE:detachEvent
- 赋值式
- obox.onclick = function(){}
- 0兼容,不能重复绑定,只能冒泡
- 删除:obox.onclick = null;
- 监听式
- obox.addEventListener("click",function(){},false)
- 有兼容,能重复绑定,最后一个参数控制冒泡 或 捕获
- 兼容处理
- 正常:addEventListener
- IE:attachEvent
- 删除方式
- 正常:removeEventListener
- IE:detachEvent
6. 事件委托
- 将多个后代元素的相同事件,委托给共同的页面上现有的父元素,利用事件冒泡,配合事件对象身上的事件目标,找到真正要点击的元素
- 好处:
1. 节省内容
2. 可以给页面上暂时不存在的元素绑定事件(给动态的html绑定事件)
- 将多个后代元素的相同事件,委托给共同的页面上现有的父元素,利用事件冒泡,配合事件对象身上的事件目标,找到真正要点击的元素
- 好处:
1. 节省内容
2. 可以给页面上暂时不存在的元素绑定事件(给动态的html绑定事件)
7. 事件源和事件目标
- 事件源:
- 事件目标:
- 事件源:
- 事件目标:
8. 网页上的元素拖拽
- 事件结构
```js
obox.onmousedown = function(eve){
var downE = eve || window.event;
- 事件结构
```js
obox.onmousedown = function(eve){
var downE = eve || window.event;
document.onmousemove = function(eve){
var e = eve || window.event;
}
document.onmouseup = function(){
}
}
```
var e = eve || window.event;
}
document.onmouseup = function(){
}
}
```
# 二、正则
1. 概念和意义
- 概念:
- 正则表达式,正则对象,正确的规则,描述字符串的规则
- 正则一般都是配合字符串使用
- 可以对字符串进行:验证,替换,查询
- 意义:
- 快速的验证,查询,替换字符
- 除非极端情况,正则既可以节省操作,又可以节省性能
- 证明:6正则的意义.html
1. 概念和意义
- 概念:
- 正则表达式,正则对象,正确的规则,描述字符串的规则
- 正则一般都是配合字符串使用
- 可以对字符串进行:验证,替换,查询
- 意义:
- 快速的验证,查询,替换字符
- 除非极端情况,正则既可以节省操作,又可以节省性能
- 证明:6正则的意义.html
2. 如何创建正则
- 字面量
```js
var reg1 = /正则的内容/;
```
- 构造函数
```js
var reg2 = new RegExp();
```
- 字面量正则中不允许出现变量,构造函数可以,但是使用都是一致的
- 字面量
```js
var reg1 = /正则的内容/;
```
- 构造函数
```js
var reg2 = new RegExp();
```
- 字面量正则中不允许出现变量,构造函数可以,但是使用都是一致的
3. 如何使用
- 验证,替换,查询
- 正则的方法
- 验证:reg.test(str) ***
- 默认验证局部字符串(是否包含)
- 只要字符串中,有一部分符合,就符合
- 整体验证,需要标记开头和结尾
- 从第一位开始验证,验证到最后一位
- ^:开始
- $:结束
- 查询:reg.exec(str)
- reg.exec(str)
- 每次查询时,会在上次查询结束的位置继续查询
- 直到查询到最后,返回null
- 继续回到初始位置,开始查询
- 但其实,正则开始验证的位置,是可修改的
- 正则的属性:reg.lastIndex
- 表示查询到字符的某个位置的索引
- 字符的方法
- 替换:str.replace(reg,"newStr") ***
- 替换
- 查询:str.match(reg) ***
- 根据指定规则,查询字符串中符合的子串,放在一个数组中
- 查询:str.search(reg)
- 第一次出现的位置的索引
- 验证,替换,查询
- 正则的方法
- 验证:reg.test(str) ***
- 默认验证局部字符串(是否包含)
- 只要字符串中,有一部分符合,就符合
- 整体验证,需要标记开头和结尾
- 从第一位开始验证,验证到最后一位
- ^:开始
- $:结束
- 查询:reg.exec(str)
- reg.exec(str)
- 每次查询时,会在上次查询结束的位置继续查询
- 直到查询到最后,返回null
- 继续回到初始位置,开始查询
- 但其实,正则开始验证的位置,是可修改的
- 正则的属性:reg.lastIndex
- 表示查询到字符的某个位置的索引
- 字符的方法
- 替换:str.replace(reg,"newStr") ***
- 替换
- 查询:str.match(reg) ***
- 根据指定规则,查询字符串中符合的子串,放在一个数组中
- 查询:str.search(reg)
- 第一次出现的位置的索引
4. 如何写
- "乱码"该怎么写,有什么含义
- 修饰符
- g:全局匹配
- i:忽略大小写
- 量词
- +:一个或以上
- *:零个或以上
- ?:零个或一个
- {n}:固定n次
- {n,}:至少n次,以上
- {n,m}:至少n次,最多m次
- 或:|
- 子集:()
- 范围符:-
- 中元符:[],用来标记范围,内部所有组成都是或的关系
- 转义符:
- \d,表示所有的数字,等同于[0-9]
- \w,表示所有的数字字母下划线,等同于[0-9a-zA-Z_]
- \s,表示空格,等同于:
- \D,表示除了数字,等同于[^0-9]
- \W,表示除了数字字母下换线,等同于[^a-z0-9A-Z_]
- \S,表示除了空格,[^\s]
- 非:^,必须在中元符内使用
- "乱码"该怎么写,有什么含义
- 修饰符
- g:全局匹配
- i:忽略大小写
- 量词
- +:一个或以上
- *:零个或以上
- ?:零个或一个
- {n}:固定n次
- {n,}:至少n次,以上
- {n,m}:至少n次,最多m次
- 或:|
- 子集:()
- 范围符:-
- 中元符:[],用来标记范围,内部所有组成都是或的关系
- 转义符:
- \d,表示所有的数字,等同于[0-9]
- \w,表示所有的数字字母下划线,等同于[0-9a-zA-Z_]
- \s,表示空格,等同于:
- \D,表示除了数字,等同于[^0-9]
- \W,表示除了数字字母下换线,等同于[^a-z0-9A-Z_]
- \S,表示除了空格,[^\s]
- 非:^,必须在中元符内使用
相关推荐
wangzhaotongalex 2020-10-20
wyq 2020-11-11
TLROJE 2020-10-26
风雨断肠人 2020-10-13
duanqingfeng 2020-09-29
rechanel 2020-11-16
cshanzhizi 2020-10-16
luofuIT成长记录 2020-09-22
phphub 2020-09-10
taomengxing 2020-09-07
MaggieRose 2020-08-19
flyingssky 2020-08-18
山水沐光 2020-08-18
jyj00 2020-08-15
AHuqihua 2020-08-09
山水沐光 2020-08-03