前端js window对象及正则表达式

前端开发入门 前端项目开发报告 杭州地区前端开发就业前景
widowd子对象:history location srceen
history:window对象中保存当前窗口访问过得历史记录
history.go()
<body>
<a href=”javascript:history.go(-1)”>后退一页</a>
<a href=”javascript:history.go(1)”>前进一页</a>
<a href=”javascript:history.go(0)”>刷新</a>
</body>
location:当前窗口正在打开的url地址对象(包含当前地址的url信息);
获取:console.long(loaction.href);
跳转:location.href = “”
刷新:location.reload();
获取页面字符串:location.search;
替换:location.replace();
screen:当前屏幕显示信息
width/height:显示器页面
availWidth/availHeight:显示器宽高(不包含任务栏);
事件:当用户和web页面进行某些交互操作,解释器会自动创建相应的对象(event)描述事件信息
事件处理函数:当事件出发时自动执行的函数,本质就是对象的已特殊属性
鼠标事件、键盘事件onkeydown,onkeyup 、状态事件 onload
绑定事件:
1.在html中, on事件名=“js语句”
2.在js中 对象.on事件名=函数对象
3.在DOM标准下
对象.addEventlistener(“事件名”,函数对象,是否在捕获阶段触发);
True在捕获阶段触发
在IE8情况下
事件周期:浏览器在捕获阶段开始到事件触发完成经历的过程;
3阶段:
1.捕获阶段(由外到内):从最外层html开始,由外向内逐层记录每层元
素绑定的事件处理函数,到目标元素停止;
2.目标触发:自动执行目标元素上绑定的事件;
3.事件冒泡(由外到内):从元素的父元素开始逐层执行每层事件
处理函数,到html为止;
获得event对象:事件发生时自动创建,封装了事件信息
html中:onclick = “fun(event)”
js fun(){
Var ev =
}
目标对象 ev.srcElement || ev.target;
取消冒泡
If(ev.stopPropagtion){
ev.stopPropagtion();
}
Else{
ev.cancelBubble=true;//IE8
}
事件委托:利用事件冒泡原理把子元素的事件给父元素绑定
事件坐标:
相对于浏览器显示区域坐标ev.clientX+”+”+ev.clientY
相对于元素左上角坐标ev.offsetX+”+”+ev.offsetY
console.log(odiv.offsetWidth+”+”+odiv.offsetHeight);
console.log(odiv.offsetTop+”+”+odiv.offsetLeft);
console.log(document.documentElement.clientWidth)
console.log(document.documentElement.clientHeight)
.clientWidth/Height:浏览器窗口的宽度、高度
正则表达式
使用环境:
  1. 登录:密码验证(字符串+数字)“ucai123”
  2. 注册:邮箱、手机号、账号
  3. 解析歌词(lrc)
创建方式:
  1. new RegExp();
如:公式:var regexp = new RegExp(“匹配的规则”,“修饰符”);
  1. // (经常使用的)
regexp = /匹配的规则/修饰符;
如:公式:regexp = /gulei/;
正则表达式用于验证字符串是否符合使用规则的;
可使用的测试方式:
  1. test:类型:function->Boolean 表示是否符合咱们设置的规则
  2. exec:
验证字符串的规则,有两种情况
>1 符合规则 –> result -> Array
>2 不符合规则 –> result -> null
正则表达式修饰符
  1. i
在匹配的时候不区分大小写
如:var regExp = /[a-z]/i;
document.write(regExp.test(“wwete”));
  1. g
全部都匹配完成之后,停止(不会匹配到第一个就停止)
match:是字符串对象,查找包含某个内容的函数;
match()需要传入一个参数
string.match(regExp) -> Array -> 匹配之后的结果
regExp = /ucai/g;
document.write(“hello ucai! 你好 ucai”.match(regExp));
注:不可以直接使用正则表达式中的测试方法,需要使用字符串的方法<search 、 match 、 replace 、 split>
正则表达式的模式(规则)
  1. 三种括号的意义
>1 中括号[] 只要符合中括号中任意的字符就是成功的;
如:[a-z](只要是a-z之间的小写字母都可以)、[asdfg](只要是在这几个小写字母都可以)
>2 花括号的意义-> 匹配内容的数量
如: ①{3}必须有三个重复的内容
②/^[A-z]{3}/ 必须以三个字母开头
③ {3,} 必须有三个以上 这种重复的内容
④{3,5} 必须是3-5个范围之内的内容
如:/[\d]{2,}/ 必须包含两个数字
如:/[A-z]{3,5}$/ 必须以3-5个字母结束
>3
元字符:->有特殊意义的字符
(在使用的时候,前面(字符)需要加转义符\).除了\n都匹配
w:0-9 a-z A-Z (大写的W与它相反)
w:0-9 a-z A-Z(大写的W与它相反)
d:0-9 (大写的D与它相反)
s:空白字符 (大写的S与它相反)
b: 单词的边界 (大写的B与它相反)
1. b 可以作为单词的起始或者结束位置
* \b写在某个字符的前面 就表示起始位置
* \b写在某个字符的后面 就表示结束位置
* 2. 注意 单词是 一个整体 (不可以包含空格 包含空格就表示两个单词)
3. 注意如果是中文 没办法判断 (indexOf(小明))
量词:
{} 匹配内容的数量
^ 以什么开始
$ 以什么结束
量词:
  1. 可以匹配前面的规则 也可以不匹配
如:/w*/
  1. 至少匹配一个 前面的规则
如:/w+/
?可以匹配前面的规则 也可以不匹配
如:
/w?/
/[A-z]?/
?= 表示需要匹配某个规则后面的规则
如:/w(?=o)/
?! 表示 后面没有紧跟某个 规则
如:
/w(?!o)/
/[a-z](?![0-9])/
前端开发相关的公众号 前端开发快速入门 web前端开发项目描述
» 本文来自:前端开发者 » 《前端js window对象及正则表达式》
» 本文链接地址:https://www.rokub.com/38140.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!