转贴(佚名):Javascript正则表达式测试网页

最新推荐文章于 2024-07-28 20:27:10 发布

onlytiancai

最新推荐文章于 2024-07-28 20:27:10 发布

阅读量1.4k

点赞数

分类专栏：编程技巧文章标签：正则表达式 javascript 测试 null regex button

编程技巧专栏收录该内容

29 篇文章 0 订阅

订阅专栏

转贴(佚名):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);

        // 定义结果

        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' οnclick="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>

onlytiancai

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
6
评论
转贴(佚名):Javascript正则表达式测试网页

转贴(佚名):Javascript正则表达式测试网页你平时如何测试正则表达式？直接写在大段的代码中，然后等待程序运行到那里，再用alert显示结果？或者是临时写一个页面，测试完成后把它丢掉？你可以试一下我这个页面，虽然它很粗糙，但是测试正则表达式也足够了:)) 一、说明：1. 我的本意为交流技术．本人水平很菜．因此所贴出的代码中，会有不足之处．2. 代码可任意修改．如果你觉得
复制链接

扫一扫

专栏目录