![]()
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>js正则表达式用法</title>
6 <style type="text/css">
7 input{
8 display: block;
9 }
10 </style>
11 <script type="text/javascript">
12 window.onload = function(){
13 var reg = document.getElementById('reg');
14 var str = document.getElementById('str');
15 var search_res = document.getElementById('search_res');
16 var replace_res = document.getElementById('replace_res');
17 var test_res = document.getElementById('test_res');
18 var exec_res = document.getElementById('exec_res');
19 var btn = document.getElementById("btn");
20
21 obtn.onclick = function(){
22
23 // 正则表达式
24 var regStr = reg.value;
25 // 需要进行匹配的字符串
26 var strStr = str.value;
27
28 var searchResult = search_res.value;
29 var replaceResult = replace_res.value;
30 var testResult = test_res.value;
31 var execResult= exec_res.value;
32
33 var patt1=new RegExp(regStr);
34
35 // search方法的结果
36 search_res.value = strStr.search(patt1);
37 // replace_res的结果,匹配则替换，不匹配则返回原来的字串
38 replace_res.value = strStr.replace(patt1,"替换的字符串")
39 //test 方法的结果
40 test_res.value = patt1.test(strStr);
41 //exec 方法的结果,匹配成功返回结果，不成功返回null
42 exec_res.value = patt1.exec(strStr).toString();
43 }
44 }
45 </script>
46 </head>
47 <body>
48 正则表达式：<input id="reg" type="text"/>
49 <br/>
50 字符串：<input id="str" type="text"/>
51 <br/>
52 search结果(检索和正则表达式相匹配的子字符串，并返回子串的起始位置)：<input id="search_res" type="text"/>
53 <br/>
54 replace结果(替换一个与正则表达式匹配的子串):<input id="replace_res" type="text"/>
55 <br/>
56 test结果(检测是否匹配，返回true或者false):<input id="test_res" type="text"/>
57 <br/>
58 exec结果(存放匹配的结果，不匹配则为null):<input id="exec_res" type="text"/>
59 <br/>
60 <input id="obtn" type="button" name="" value="提交"/>
61 </body>
62 </html>
参考文档
浙公网安备 33010602011771号