韩顺平 javascript教学视频_学习笔记34

内容介绍----正则表达式的详解

正则表达式对象：

RegExp对象方法

我们来看一下RegExp对象都有哪些方法

例子不举了，很简单

String 对象与正则表达式有关的方法

这四个方法是属于String对象的，不是属于RegExp对象的

search()方法

<script type="text/javascript">var str="Visit W3School!"
document.write(str.search(/W3School/))</script>

输出 6；

match()方法

<!DOCTYPE html>
<html>
<head>
<script language="javascript">  function test1(){//match()方法var con=content.innerText;var myReg=/abc/gi; res = con.match(myReg);for(var i=0;i<res.length;i++){window.alert(i+" "+res[0]);}}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20">
abcasdlfkjaslkabca;lkfjasl;dkabcaslkfjs;alkdfj
</textarea>
<input type="button" value="测试" οnclick="test1()"/>
</body>
</html>

replace()方法

<!DOCTYPE html>
<html>
<head>
<script language="javascript">  //replace()方法function test1(){var con=content.innerText;//把四个数，换成 这里原来有四个数var myReg=/abc/gi; var newCon = con.replace(myReg,"这里原来有四个数");content.innerText=newCon;}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20">
abcasdlfkjaslk1234abca;lkfjas4345657l;dkabc56878aslkfjs;alkdfjsadjlfkjsdkflj;sldk
</textarea>
<input type="button" value="开始替换" οnclick="test1()"/>
</body>
</html>

split()方法

这里不讲了

RegExp对象的属性

举例说明：

<!DOCTYPE html>
<html>
<head>
<script language="javascript">  //index,leftContext,rightContext 三个属性function test1(){var con=content.innerText;//把四个数，换成 这里原来有四个数var myReg=/abc/gi; while(res=myReg.exec(con)){window.alert("index:"+RegExp.index+" leftContext:"+RegExp.leftContext+" rightContext:"+RegExp.rightContext);}}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20">
abcasdlfkjaslk1234abca;lkfjas4345657l;dkabc56878aslkfjs;alkdfjsadjlfkjsdkflj;sldk
</textarea>
<input type="button" value="测试" οnclick="test1()"/>
</body>
</html>

注意这个source，source就是可以看一下你当前是对那个字符串进行操作，这个不举例了

这个很重要，

子表达式，捕获，反向引用

举例解决第一个问题：

<!DOCTYPE html>
<html>
<head>
<script language="javascript">  function test1(){var con=content.innerText;var myReg=/(\d)(\d)\2\1/gi; //解释：看后面while(res=myReg.exec(con)){window.alert(res[0]);}}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20">
289472393443982374982374788729837491898892983754985
</textarea>
<input type="button" value="测试" οnclick="test1()"/>
</body>
</html>

看下图对子表达式，捕获，反向引用的解释

下面再看几个例子：

<!DOCTYPE html>
<html>
<head>
<script language="javascript">  function test1(){var con=content.innerText;//查找类似于 aabbccdd 的数字var myReg1=/(\d)\1(\d)\2(\d)\3(\d)\4/gi; while(res=myReg1.exec(con)){window.alert(res[0]);}//查找类似于 12321-333999111 这样的号码，要求满足前面是一个五位数，然后是一个-号//然后是一个九位数，连续的每三位要相同//下面 4 种方法都是可以的//var myReg2=/(\d){5}-(\d)\2\2(\d)\3\3(\d)\4\4/gi; //var myReg2=/(\d){5}(-)(\d)\3\3(\d)\4\4(\d)\5\5/gi; //var myReg2=/(\d){5}(-)((\d)\4\4){3}/gi;  var myReg2=/(\d){5}-((\d)\3\3){3}/gi;  //注意：这里不是((\d)\2\2){3}，反向捕获是以左括号为标志的，前面有几个左括号，那么就反向捕获第几个子表达式的内容while(res=myReg2.exec(con)){window.alert(res[0]);}}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20">
289472393443981122334423755667788412321-33399911198237478875241-99966655529837491898892983754985
</textarea>
<input type="button" value="测试" οnclick="test1()"/>
</body>
</html>

特别注意：反向捕获是以左括号为标志的，前面有几个左括号，那么就反向捕获第几个子表达式的内容

元字符

var myReg1=/(\w)\1{2}/gi; 这个表达式和上图中红色区域的效果是一样的

代码：

<!DOCTYPE html>
<html>
<head>
<script language="javascript">  function test1(){var con=content.innerText;var myReg1=/(\w)\1{2}/gi; //对这个表达式要好好理解while(res=myReg1.exec(con)){window.alert(res[0]);}}
</script>
</head>
<body>
<textarea id="content" rows="10" cols="20">
289472393fff555443sdfkjghkj98112233442375hkj566
</textarea>
<input type="button" value="测试" οnclick="test1()"/>
</body>
</html>

var myReg1=/^han/gi;  //匹配字符串中的开头的han
var myReg2=/han$/gi;  //匹配字符串中的最后的han

这个比较重要

代码如下：

<!DOCTYPE html>
<html>
<head>
<script language="javascript">  function test1(){var con=content.innerText;var myReg1=/^[a-zA-z0-9_-]+@([a-zA-z0-9]+\.)+(com|cn|net|org)$/gi; var res=myReg1.exec(con)if(res){window.alert("是邮件");window.alert(res[0]);}else {window.alert("不是邮件");}}</script>
</head>
<body>
<textarea id="content" rows="10" cols="20"></textarea>
<input type="button" value="测试" οnclick="test1()"/><br/>
</body>
</html>

韩顺平 javascript教学视频_学习笔记34_js正则表达式详解相关推荐

韩顺平 javascript教学视频_学习笔记20_多态经典案例_补讲闭包细节
多态经典案例经典案例,看代码: <html> <head> <script language="javascript"> function M ...
韩顺平 javascript教学视频_学习笔记17_js超级玛丽小游戏
采用面向对象思想设计超级马里奥游戏人物怎么用通过按键,来控制图片的位置这个小游戏,用面向对象会很方便,不用面向对象会很麻烦很麻烦,比如以后要讲解的坦克大战的游戏,要是用纯的面向过程或函数式的方式写 ...
ELK学习笔记之Logstash详解
0x00 Logstash概述官方介绍:Logstash is an open source data collection engine with real-time pipelining cap ...
expect学习笔记及实例详解【转】
1. expect是基于tcl演变而来的,所以很多语法和tcl类似,基本的语法如下所示: 1.1 首行加上/usr/bin/expect 1.2 spawn: 后面加上需要执行的shell命令,比如说 ...
Java中大数据数组,Java基础学习笔记之数组详解
摘要:这篇Java开发技术栏目下的"Java基础学习笔记之数组详解",介绍的技术点是"java基础学习笔记.基础学习笔记.Java基础.数组详解.学习笔记.Java&qu ...
oracle scn 重置,学习笔记:Oracle SCN详解 SCN与Oracle数据库恢复的关系
天萃荷净分享一篇关于Oracle SCN的详解,介绍SCN与Oracle数据库恢复的关系和SCN在数据库中的作用一.为什么需要System checkpoint SCN号与Datafile Che ...
qstring如何初始化_学习QT之QString详解
学习QT之QString详解 QString类保存16位Unicode值,提供了丰富的操作.查询和转换函数.该类还进行了使用隐式共享.高效的内存分配策略等多方面的优化. 一.字符串常用操作字符串的操 ...
CSS入门学习笔记（案例+详解）
CSS入门学习笔记一.CSS简介 1.什么是CSS? 2.为什么使用CSS? 3.CSS的作用二.CSS语法 1.CSS基础语法 2.CSS注释语法 3.CSS应用方法三.CSS选择器 1.元素 ...
【Python全栈100天学习笔记】Day37MySQL详解（sql语句基本操作含索引、视图、存储过程）
SQL详解基本操作我们通常可以将SQL分为三类:DDL(数据定义语言).DML(数据操作语言)和DCL(数据控制语言).DDL主要用于创建(create).删除(drop).修改(alter)数据 ...

韩顺平 javascript教学视频_学习笔记34_js正则表达式详解

内容介绍----正则表达式的详解

正则表达式对象：

split()方法

韩顺平 javascript教学视频_学习笔记34_js正则表达式详解相关推荐

最新文章

热门文章