Javascript正则表达式测试网页-JAVA91知识库

Javascript正则表达式测试网页

转自:互联网

你平时如何测试正则表达式？直接写在大段的代码中，然后等待程序运行到那里，再用alert显示结果？或者是临时写一个页面，测试完成后把它丢掉？
你可以试一下我这个页面，虽然它很粗糙，但是测试正则表达式也足够了
　　一、说明：

　　1. 我的本意为交流技术．本人水平很菜．因此所贴出的代码中，会有不足之处．

　　2. 代码可任意修改．如果你觉得你修改过的代码比我的好，可将它贴出，我非常感谢．

　　3. 我对javascript的规范并不很熟悉．我的经验来自于开发．因此，若你对它有更好的见解，欢迎提出，我非常感谢．

　　二、测试用例:

　　1. 检查字符串中是否有非数字的字符:

　　test regex: D
　　test regex flags: g
　　test string: 1234g56t78

　　2. 检查字符串中是否有非0-9、a~z、A-Z、_的字符:

　　test regex: W
　　test regex flags: g
　　test string: i'm a pig! yes I'm!

　　3. 匹配字符串中的实数:

　　test regex: ([d]+]).([d]+)
　　test regex flags: g
　　test string: float1234.58.723c65.183

　　三、程序代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE>Javascript regex test page</TITLE> 
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=GB2312"> 
<SCRIPT> 
/** 
* Method 测试正则表达式函数 
* @param method 接收到的正则表达式类的方法 
*/ 
function check(method){ 
　　// 将用户输入的正则表达式的标志转换为小写 
　　form1.flags.value = form1.flags.value.toLowerCase(); 
　　// 如果含有不是g、i、m的字符, 则 提示并返回 
　　if ( form1.flags.value.search(/[^g|i|m]/g) != -1 ) { 
　　　　alert("flags only can be g, i, m"); 
　　　　return; 
　　} 
　　// 利用用户输入的字符串和标志建立正则表达式 
　　var re = new RegExp(form1.regex.value, form1.flags.value); 
　　// 获得并显示生成的正则表达式的字符串形式 
　　destRegex.innerText = re.toString() + ' '; 
　　// 定义 返回值 
　　var cr; 
　　ex = "new RegExp('" + form1.regex.value + "', '" + form1.flags.value + "')."; 
　　// 根据用户选择的方法, 进行相应的调用 
　　switch ( method ) { 
　　　　case '0': // 正则表达式的 exec 方法 
　　　　　　cr = re.exec(form1.string.value); 
　　　　　　ex = ex + "exec('" + form1.string.value + "')"; 
　　　　　　break; 
　　　　case '1': // 正则表达式的 test 方法 
　　　　　　cr = re.test(form1.string.value); 
　　　　　　ex = ex + "test('" + form1.string.value + "')"; 
　　　　　　break; 
　　　　case '2': // 字符串类的 match 方法 
　　　　　　cr = form1.string.value.match(re); 
　　　　　　ex = "'" + form1.string.value + "'.match(" + re.toString() + ")"; 
　　　　　　break; 
　　　　case '3': // 字符串类的 search 方法 
　　　　　　cr = form1.string.value.search(re); 
　　　　　　ex = "'" + form1.string.value + "'.search(" + re.toString() + ")"; 
　　　　　　break; 
　　　　case '4': // 字符串类的 replace 方法 
　　　　　　cr = form1.string.value.replace(re); 
　　　　　　ex = "'" + form1.string.value + "'.replace(" + re.toString() + ")"; 
　　　　　　break; 
　　　　case '5': // 字符串类的 split 方法 
　　　　　　cr = form1.string.value.split(re); 
　　　　　　ex = "'" + form1.string.value + "'.split(" + re.toString() + ")"; 
　　　　　　break; 
　　　} 
　　// 获得并显示表达式 
　　expression.innerText = ex; 
　　// 获得并显示计算结果的类型 
　　returnType.innerText = typeof(cr); 
　　// 定义结果

<TR> 
　　<TD>test string:</TD> 
　　<TD><INPUT NAME="string" TYPE="text"></TD> 
</TR>

<TR> 
　　<TD>select method:</TD> 
　　<TD ALIGN="CENTER"> 
　　　　<SELECT NAME="select" onChange="check(this.value)"> 
　　　　　　<OPTION VALUE="0">exec</OPTION> 
　　　　　　<OPTION VALUE="1">test</OPTION> 
　　　　　　<OPTION VALUE="2">match</OPTION> 
　　　　　　<OPTION VALUE="3">search</OPTION> 
　　　　　　<OPTION VALUE="4">replace</OPTION> 
　　　　　　<OPTION VALUE="5">split</OPTION> 
　　　　</SELECT> 
　　　　<INPUT VALUE='run' onclick="check(form1.select.value)" TYPE=button> 
　　</TD> 
</TR> 
<TR> 
　　<TD>dest regex:</TD> 
　　<TD STYLE="color:blue" ID=destRegex> </TD> 
</TR> 
<TR> 
　　<TD>dest expression:</TD> 
　　<TD STYLE="color:blue" ID=expression> </TD> 
<TR>
<TR>
　　<TD>return type:</TD> 
　　<TD STYLE="color:darkred" ID=returnType> </TD> 
</TR> 
<TR> 
　　<TD>result:</TD> 
　　<TD STYLE="color:red" ID=matchResult> </TD> 
</TR> 
<TR>
　　<TD>regex lastIndex:</TD>
　　<TD STYLE="color:red" ID=lastIndex> </TD> 
</TR> 
</TABLE> 
</FORM> 
</BODY> 
</HTML>