1、正则表达式的创建方式
两种方式创建:通过new修饰符创建和字面量的方式创建
1》new修饰符方式创建
var b2=new RegExp('Box','ig'); //第二个参数是 模式字符串: 用来限定 匹配的方式
// g :全局匹配 i:忽略大小写的匹配 m :多行匹配
2》字面量的方式创建
var d= /Box/i; // //之间的是 参数字符串;;第二个/ 后面的是 模式字符串
2、js中正则表达式的测试方式
两种测试方式:test()方法:检测字符串中是否“含有”对应的模式字符串,返回值是true和false;
exec()方法:检测字符串中是否“含有”对应的模式字符串,返回值是匹配到的字符串的数组,如果没有就返回null(返回值类型:object)
var d= /Box/i; //忽略大小写的匹配
alert(d.test('box')); //true alert(/Box/i.test('this is a box')); //true : 匹配字符串中是否 “含有” 匹配字符串 alert(d.exec('box')); //box alert( typeof d.exec('s')); //object
3、String类方法中使用的正则表达式
String类的match()、search()、replace()、split()
1》match()字符串的匹配方法,返回匹配到的数组
var pattern=/Box/gi; //全局匹配 不区分大小写
var b ='This is a box!It is a small box';
alert(b.match(pattern)); //返回 的是 匹配到的数组 (box,box)
//如果不是全局匹配,,那么 只会 匹配第一个 ,返回的数组 只会含有一个 元素
pattern =/Box/i;
alert(b.match(pattern)); //box
2》search()返回第一个匹配到的字符串索引位置 ,g(全局匹配)在这里不起作用,如果没有匹配到就返回-1
alert(b.search(pattern)); //
3》replace():找到要被匹配的字符串,然后用指定的字符串进行替换;返回值:返回替换后的字符串
alert(b.replace(pattern,'shit')); //返回 替换后的 字符串
注意:如果不是全局匹配的换,只有第一个匹配到的字符串被替换
4》split()按照指定的 “匹配符” 进行分割
alert(b.split(pattern)); // This is a ,!It is a small ,
正则表达式的静态方法和实例方法在这里就不做介绍,因为不常用,所以用的时候在查。
4、获取和控制(*重点)
1》单个字符和数字的匹配
下面通过代码进行演示其使用的方式
var pattern =/[a-z]oogle/; //[a-z] 表示 小写字母中的 任意一个
alert(pattern.test("google")); //true //下面一定要注意(****)
var pattern =/[A-Z]oogle/; //匹配的时候 是 匹配 字符串中是否含有 “匹配的字符串”
alert(pattern.test('aaaaaaGGGGoogleaaaa')); //true alert(/[0-9]aaaa/.test("444aaaa")); //true
还可以进行“复合”匹配
var pattern3=/[a-zA-Z0-9]/; //匹配的 a-z和A-Z和0-9都可以 类似于"/w" var pattern4=/[^a-z]oogle/; //[^a-z] 代表的就是 非 a-z 的字符
2》空白字符的匹配
代码演示:
//空格字符的匹配 \s
var pattern =/goo\sgle/;
var str='goo gle'; alert(pattern.test(str)); //true
3》锚字符的匹配
主要是对匹配的控制
代码演示:
var pattern ='/^[0-9]oogle/' //^ 位于 匹配字符串的 开头 代表 匹配字符串的 匹配是 从 字符串的 开头开始的
alert(pattern.test("4444oogle"));//false 因为是 从 最前面的 那个 4 进行匹配的 alert(/^[0-9]+oogle/.test("4444oogle")); //true + 代表是 1个 或 多个 //全局控制
var pattern2=/^\woogle$/; //^讲开头控制住,,$将结尾控制住,,所以 就是全局控制,,,\w 代表 匹配 数字字母和_
\b:行尾匹配
var pattern2 =/google\b/; //\b 代表是否到达结尾;;;就是e 是否是 最后一个字符
var str2='googleeeee'; alert(pattern2.test(str2)); //false
alert(pattern2.test('google')); //true
5》重复匹配
代码演示:
var pattern =/go{3}gle/; //限定 o 为三个
var pattern2=/go{2,4}gle/; //限定 o 为2 到4 个
var pattern3=/go{3,}gle/; //限定o为 3个 或者 3个以上 var d='google';
alert(pattern.test(d)); //false
alert(pattern2.test('goooogle')); //true
alert(pattern3.test('gooooogle')); //true
6》替代匹配
代码演示:
var pattern =/box|\w+oogle/; //字符串匹配到 'box' 或者 '\w+oogle'都会返回 true
alert(pattern.test('box')); //true
alert(pattern.test('shigggoogle')); //true
7》分组匹配
记录字符:
使用RegExp的静态属性 $1 获得 是分组中的内容。
()分组匹配演示:
var pattern3 =/google{4,8}$/; //代表 匹配 e字符 4到 8 次
var str3='googleeeee'; alert(pattern3.test(str3)); //true var pattern4=/(google){4,8}/; //表示 匹配 google 4到 8 次
alert(pattern4.test('googlegooglegooglegoogle'));//true
$1:取到匹配到的第一个分组的字符串(难点):
var pattern =/8(.*)8/;
var str='This is a 8google8';
//只要匹配 一次就可以;;不管是怎样的 匹配
//pattern.test(str); str.match(pattern);//和上面 一样,,下面也能够 取到 分组匹配到的 字符串 //上面两种任意一种方式还要是匹配,之后就可以通过下面 取到第一分组 匹配到的字符串。
alert(RegExp.$1); //google
演示一个案例,将匹配到的字符串 加粗,打印出来
var str2='You are a 8shit8'; document.write(str2.replace(pattern,'<strong>$1</strong>')); //$1 取出 匹配到的 分组字符串
演示第二个案例,将 'google baidu' 两个单词位置调换
var pattern2=/(.*)\s(.*)/;
var str='google baidu';
alert(str.replace(pattern2,'$2 $1')); //将 他们的 位置 调换
8》贪婪和惰性
示例一:
var pattern =/[a-z]+/; //贪婪模式
var str='ddfdfds'; alert(str.replace(pattern,1)); //1 //只会 匹配到 第一个 将第一个 替换掉 pattern=/[a-z]/g; //进行全局匹配 alert(str.replace(pattern,1)); // //使用 惰性模式
pattern =/[a-z]+?/;
alert(str.replace(pattern,1)); //1dfdfds
下面是显示贪婪模式的经典例子
//贪婪模式
var pattern2=/8(.*)8/g;
var str='8google8 8google8 8google8'; //最先 匹配的 两边的 88 因为 . 也 匹配 8
//<strong>google8 8google8 8google</strong>
document.write(str.replace(pattern2,'<strong>$1</strong>'));
输出结果:
使用惰性模式:
//下面使用 惰性模式
pattern2=/8(.*?)8/g;
document.write(str.replace(pattern2,"<strong>$1</strong>"));
//输出结果:
//<strong>google</strong>
//<strong>google</strong>
//<strong>google</strong>
输出结果:
使用 另一种 禁止贪婪的模式:
pattern2=/8([^8]*)8/g;
document.write(str.replace(pattern2,"<strong>$1</strong>")); //和上面 的 实现的 效果一样
输出结果: