• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >正则表达式 > Javascript正则表达式测试网页

Javascript正则表达式测试网页

作者: 字体:[增加 减小] 来源:互联网 时间:2017-05-11

通过本文主要向大家介绍了javascript正则表达式,javascript 正则,javascript正则匹配,javascript 正则 x0b,javascript 正则替换等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com
你平时如何测试正则表达式?直接写在大段的代码中,然后等待程序运行到那里,再用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> </div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • JavaScript的正则也有单行模式了
  • JavaScript正则表达式校验非零的正整数实例
  • JavaScript正则表达式校验非零的负整数实例
  • JavaScript系列文章:详解正则表达式基本知识
  • Javascript校验密码复杂度的正则表达式
  • JavaScript中一些常用的正则表达式(推荐)
  • JavaScript正则表达式验证代码(推荐)
  • JavaScript正则表达式下之相关方法
  • JavaScript正则表达式上之基本语法(推荐)
  • JavaScript 中的正则表达式(推荐)

相关文章

  • 2017-05-11SqlParser 一个利用正则表达式解析单句SQL的类
  • 2017-05-11用正则按最后一个"_"分割"字符
  • 2017-05-11如何快速学习正则表达式
  • 2017-05-11最常用的PHP正则表达式收集整理
  • 2017-05-11正则表达式简单的检查输入email是否合法程序
  • 2017-05-11python3爬虫之入门基础和正则表达式
  • 2017-05-11JS正则表达式验证数字(非常全)
  • 2017-05-11php正则之函数 preg_replace()参数说明
  • 2017-05-11常用的正则表达式集锦
  • 2017-05-11常用正则表达式知识点解读及判读有效数字、手机号邮箱正则表达式

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • js:日期正则表达式及检测
    • JS使用正则去除字符串最后的逗号
    • 去除内容中的html
    • 检查素数的正则表达式分享
    • 正则表达式中的正向预查和负向预查实例分析
    • js正则匹配table tr
    • [asp]中的正则表达式运用代码
    • 正则表达式(regex)入门、元字符(特殊字符)学习与提高
    • 17种常用正则表达式
    • UBB 转换函数演示 (经典论坛)

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有