你平时如何测试正则表达式?直接写在大段的代码中,然后等待程序运行到那里,再用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);
// 定义结果
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>
分享到:
相关推荐
Javascript正则表达式测试网页.rar 学习和做网页时使用的手册
Javascript正则表达式测试网页.docx
RegexApplication/Default.aspx 正则表达式类的应用 RegexApplication/GetPageHtmlData.aspx 获取网页的内容 第10章(/10/) ASPNETValidator/Compare.aspx 比较验证 ASPNETValidator/...
我们已经发现了,在正则表达式中所有的字母字符和数字都是按照字面意思与自身相匹配的.JavaScript的正则表达式还通过以反斜杠(\)开头的转义序列支持某些非 字母字符.例如,序列 "\n" 在字符串中匹配的是一个直接量换...
对于复杂的网页编程实现,经常要用到正则表达式,拼凑出来的表达式正确不正确,如果自己去写测试代码,太费时间了,我收集的这个工具就可以很好地解决这个问题;另外工具包中还提供一个JavaScript代码格式转换工具,...
• Javascript正则表达式在线测试工具 如果你不觉得正则表达式很难读写的话,要么你是一个天才,要么,你不是地球人。正则表达式的语法很令人头疼,即使对经常使用它的人来说也是如此。由于难于读写,容易出错,...
界面很清晰,javascript编写网页就能打开,带有说明一看就会。
正则表达式,再各种语言中都得到了很好的支持,然而正则表达式语法有点难懂,如果有一款工具用于测试就简单多了,这里是一款正则表达式测试工具,网页版的,支持java,javascript正则表达式的测试
在一些抓取、过滤等情况下, 正则表达式 regular expression 的优势是很明显的。 例如,有如下的字符串: 代码如下:<li><a>”article-date”>[09/11]</span>FCKEditor高亮代码插件测试</a></li> 现在,需要提取 href...
正则表达式基准,从50多个最流行的网页中提取正则表达式操作所产生的(1761 行)。 Splay基准 数据操作基准,处理伸展树和执行自动内存管理子系统 (394 行)。 NavierStokes基准 根据奥利弗·亨特的代码,在2D上解决...
bg2css-v3.0:Adobe公司开发的用于自动生成CSS...W3C前端开发工具包:主要集成了正则表达式测试、JavaScript/CSS代码压缩工具、CSS Sprite(s)自动生成工具、JSON格式化调试工具等功能 三个工具让前端开发变得更加简单
提供一个正则表达式的及时测试工具,并能将匹配结果进行高亮显示、高亮定位等;同时还罗列了一些常用的正则表达式供开发者使用 编码规范检测 对当前网页进行Javascript、CSS、HTML编码规范的检测,包括文件是否压缩...
提供一个正则表达式的及时测试工具,并能将匹配结果进行高亮显示、高亮定位等;同时还罗列了一些常用的正则表达式供开发者使用 页面取色工具 提供一个网页取色的工具,任意页面均可使用,方便大家在开发过程中能精准...
正则表达式类 【1】 正则表达式应用——替换指定内容到行尾 【2】 正则表达式应用——数字替换----------------------------Microshaoft@CCF,jiuk2k@CCF 【3】 正则表达式应用——删除每一行行尾的指定字符 【4】 ...
这个也算正则表达式的用法,其实仔细看正则表达式应该比较简单,不过既然有这个问题提出,说明对正则表达式还得有个认识过程,解决方法如下 解决: 在替换对话框中,启用“正则表达式”复选框 在查找内容里面输入...
二、主要技术本案例主要在PHP中使用正则表达式来实现过滤掉JavaScript脚本代码的功能 三、效果图展示实现效果图,如图1所示 五、网页测试开启Apache
这里主要介绍我自己所写的利用构建在jQuery之上的工具库,该库的原文件名为jquery.brady.js,但由于是构建在...isValidPattern: 是否满足给定的正则表达式 validateFormItem: 执行表单项验证, 必须与jQuery一起结合使用
【优爱酷可视化网站网页数据采集系统】 采用先进的可视化采集技术,智能识别网页元素类型,如:图片、文字、链接、HTML 、文件等,支持运行Javascript脚本、应用正则表达式、自动滚屏、自动翻页、打开弹出窗口并采集...
从Python语言的基本特性入手,详细介绍了Python网络爬虫开发的各个方面,涉及HTTP、HTML、JavaScript、正则表达式、自然语言处理、数据科学等不同领域的内容。全书共10章,包括Python基础知识、网站分析、网页解析、...