|
|
JavaScript正则表达式测试网页
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
广告招租，e-mail:yesize@hotmail.com
你可以试一下我这个页面，虽然它很粗糙，但是测试正则表达式也足够了:))
一、说明： 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: im a pig! yes Im!
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);
// 定义结果 var result = ;
if ( cr != null && typeof(cr) == object && cr.length != null ) // 如果计算结果是一个数组, 则取出所有数组的值 { for ( i = 0; i < cr.length; i++ ) { result += "array[" + i + "] = " + cr[i] + "\n"; } } else if ( cr != null ) // 如果计算结果不为null, 则取出计算结果的值 { result = cr; }
// 获得并显示结果 matchResult.innerText = result + ;
// 获得并显示正则表达式的lastIndex属性 lastIndex.innerText = re.lastIndex + ; } </SCRIPT> </HEAD>
<BODY ALIGN=CENTER> <FORM NAME="form1" METHOD="post" ACTION="" ALIGN=CENTER> <TABLE BORDER="1"> <TR> <TD COLSPAN="2" ALIGN="CENTER">test javascript regex</TD> </TR> <TR> <TD>test regex:</TD> <TD><INPUT NAME="regex" TYPE="text"></TD> </TR> <TR> <TD>test regex flags:</TD> <TD><INPUT NAME="flags" TYPE="text" ID="flags"></TD> </TR> <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>
|
|
|||||||||||||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
加入最爱
热门小游戏分类 
