JavaScript 正则表达...LOGIN

JavaScript 正则表达式

语法

定义

JavaScript种正则表达式有两种定义方式,定义一个匹配类似 <%XXX%> 的字符串

1. 构造函数

var reg=new RegExp('<%[^%>]+%>','g');

2. 字面量

var reg=/<%[^%>]%>/g;

g: global,全文搜索,默认搜索到第一个结果接停止

i: ingore case,忽略大小写,默认大小写敏感

m: multiple lines,多行搜索(更改^ 和$的含义,使它们分别在任意一行对待行首和行尾匹配,而不仅仅在整个字符串的开头和结尾匹配)


元字符

正则表达式让人望而却步以一个重要原因就是其转义字符太多了,组合非常之多,但是正则表达式的元字符(在正则表达式中具有特殊意义的专用字符,可以用来规定其前导字符)并不多

元字符:( [ { ^ $ | ) ? * + .

并不是每个元字符都有其特定意义,在不同的组合中元字符有不同的意义,分类看一下

预定义特殊字符

字符    含义    

t    水平制表符    

r    回车符    

n    换行符    

f    换页符    

cX    与X对应的控制字符(Ctrl+X)    

v    垂直制表符    

   空字符    


字符类

简单类

原则上正则的一个字符对应一个字符,我们可以用[]把它们括起来,让[]这个整体对应一个字符。如


alert(/ruby/.test("ruby"));//true

alert(/[abc]/.test("a"));//true

alert(/[abc]/.test("b"));//true

alert(/[abc]/.test("c"));//true

alert("a bat ,a Cat,a fAt bat ,a faT cat".match(/[bcf]at/gi));//bat,Cat,fAt,bat,faT,cat


 负向类

也是在那个括号里做文章,前面加个元字符进行取反,表示匹配不能为括号里面的字符。

alert(/[^abc]/.test("a"));//false

alert(/[^abc]/.test("b"));//false

alert(/[^abc]/.test("6"));//true

alert(/[^abc]/.test("gg"));//true

   

范围类

还是在那个中括号里面做文章。有时匹配的东西过多,而且类型又相同,全部输入太麻烦,我们可以用它。特征就是在中间加了个横线。

组合类

还是在那个中括号里面做文章。允许用中括号匹配不同类型的单个字符。

alert(/[a-f]/.test("b"));//true

alert(/[a-f]/.test("k"));//false

alert(/[a-z]/.test("h"));//true

alert(/[A-Z]/.test("gg"));//false

alert(/[^H-Y]/.test("G"));//true

alert(/[0-9]/.test("8"));//true

alert(/[^7-9]/.test("6"));//true

alert(/[a-m1-5n]/.test("a"))//true

alert(/[a-m1-5n]/.test("3"))//true

alert(/[a-m1-5n]/.test(a))//true

alert(/[a-m1-5n]/.test("r"))//false


预定义类   


字符    等同于      描述


.    [^nr]    除了换行和回车之外的任意字符    

d    [0-9]    数字字符    

D    [^0-9]    非数字字符    

s    [ tnx0Bfr]    空白字符    

S    [^ tnx0Bfr]    非空白字符    

w    [a-zA-Z_0-9]    单词字符(所有的字母)    

W    [^a-zA-Z_0-9]    非单词字符    


alert(/d/.test("3"))//true

alert(/d/.test("w"))//false

alert(/D/.test("w"))//true

alert(/w/.test("w"))//true

alert(/w/.test("司"))//false

alert(/W/.test("徒"))//true

alert(/s/.test(" "))//true

alert(/S/.test(" "))//false

alert(/S/.test("正"))//true

alert(/./.test("美"))//true

alert(/./.test("  "))//true

alert(/./.test(a))//true


支持正则表达式的String对象的方法

  1. search()方法;

该方法用于检索字符串中指定的子字符串,或检索与正 则表达式相匹配的字符串。

       基本语法:stringObject.search(regexp);

      @param 参数regexp可以需要在stringObject中检索的字符串,也可以 是需要检索的RegExp对象。

      @return(返回值) stringObject中第一个与regexp对象相匹配的子串的起 始位置。如果没有找到任何匹配的子串,则返回-1;

    注意:search()方法不执行全局匹配,它将忽略标志g,同时它也没有regexp对象的lastIndex的属性,且总是从字符串开始位置进行查找,总是返回的是stringObject匹配的第一个位置。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>
<button onclick="myFunction()">点击</button>
<p id="demo"></p>
<script>
function myFunction() {
    var str = "Visit W3cSchool!"; 
    var n = str.search(/3c/i);
    document.getElementById("demo").innerHTML = n;
}
</script>
</body>
</html>

  2. match()方法;

该方法用于在字符串内检索指定的值,或找到一个或者多个正则表达式的匹配。该方法类似于indexOf()或者lastIndexOf(); 但是它返回的是指定的值,而不是字符串的位置;

基本语法:

   stringObject.match(searchValue) 或者stringObject.match(regexp)

   @param(参数) 

   searchValue 需要检索字符串的值;

    regexp: 需要匹配模式的RegExp对象;

   @return(返回值) 存放匹配成功的数组; 它可以全局匹配模式,全局匹配的话,它返回的是一个数组。如果没有找到任何的一个匹配,那么它将返回的是null;返回的数组内有三个元素,第一个元素的存放的是匹配的文本,还有二个对象属性;index属性表明的是匹配文本的起始字符在stringObject中的位置;input属性声明的是对stringObject对象的引用;

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>
<button onclick="myFunction()">点击</button>
<p id="demo"></p>
<script>
function myFunction() {
    var str = "hello world"; 
    var n = str.match("world");
    document.getElementById("demo").innerHTML = n;
}
</script>
</body>
</html>

  3. replace()方法:

该方法用于在字符串中使用一些字符替换另一些字符,或者替换一个与正则表达式匹配的子字符串;

    基本语法:stringObject.replace(regexp/substr,replacement);

   @param(参数) 

    regexp/substr; 字符串或者需要替换模式的RegExp对象。

    replacement:一个字符串的值,被替换的文本或者生成替换文本的函数。

   @return(返回值)  返回替换后的新字符串

   注意:字符串的stringObject的replace()方法执行的是查找和替换操作,替换的模式有2种,既可以是字符串,也可以是正则匹配模式,如果是正则匹配模式的话,那么它可以加修饰符g,代表全局替换,否则的话,它只替换第一个匹配的字符串;

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>
<button onclick="myFunction()">点我</button>
<p id="demo">请访问网站</p>
<script>
function myFunction() {
    var str = document.getElementById("demo").innerHTML; 
    var txt = str.replace("网站","php.cn");
    document.getElementById("demo").innerHTML = txt;
}
</script>
</body>
</html>

 

RegExp对象方法

1. test()方法:

该方法用于检测一个字符串是否匹配某个模式;

   基本语法:RegExpObject.test(str);

   @param(参数) str是需要检测的字符串;

   @return (返回值) 如果字符串str中含有与RegExpObject匹配的文本的话,返回true,否则返回false;

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>
<script>
var patt1=new RegExp("e");
document.write(patt1.test("The best things in life are free"));
</script>
</body>
</html>

2. exec()方法: 

该方法用于检索字符串中的正则表达式的匹配。

 基本语法:RegExpObject.exec(string)

@param(参数):string【必填项】要检索的字符串。

@return(返回值):返回一个数组,存放匹配的结果,如果未找到匹配,则返回值为null;

注意:该返回的数组的第一个元素是与正则表达式相匹配的文本,该方法还返回2个属性,index属性声明的是匹配文本的第一个字符的位置;input属性则存放的是被检索的字符串string;该方法如果不是全局的话,返回的数组与match()方法返回的数组是相同的。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<body>
<script>
var patt1=new RegExp("e");
document.write(patt1.exec("The best things in life are free"));
</script>
</body>
</html>


下一节
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php.cn</title> </head> <body> <button onclick="myFunction()">点我</button> <p id="demo">请访问网站</p> <script> function myFunction() { var str = document.getElementById("demo").innerHTML; var txt = str.replace("网站","php.cn"); document.getElementById("demo").innerHTML = txt; } </script> </body> </html>
提交重置代码
章节课件