`
shihuan830619
  • 浏览: 583881 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

JS正则表达式测试和JS测试工具

阅读更多
<!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> 
if (! document.all){    //兼容Mozilla的innerText  
    HTMLElement.prototype.__defineSetter__("innerText", function (sText) {  
       this.innerHTML = sText.replace(/\&/g, "&")  
                             .replace(/>/g, ">")  
                             .replace(/</g, "<")  
                             .replace(/ /g, " ")  
                             .replace(/\n/g,"<BR/>");  
    });  
}  
 
/**  
* Method 测试正则表达式函数  
* @param method 接收到的正则表达式类的方法  
*/  
function check(method)  
{  
// 将用户输入的正则表达式的标志转换为小写  
document.getElementById("flags").value = document.getElementById("flags").value.toLowerCase();  
 
// 如果含有不是g、i、m的字符, 则 提示并返回  
if ( document.getElementById("flags").value.search(/[^g|i|m]/g) != -1 )  
{  
alert("flags only can be g, i, m");  
return;  
}  
 
// 利用用户输入的字符串和标志建立正则表达式  
var re = new RegExp(document.getElementById("regex").value, document.getElementById("flags").value);  
 
// 获得并显示生成的正则表达式的字符串形式  
document.getElementById("destRegex").innerText = re.toString() + ' ';  
 
// 定义 返回值  
var cr;  
 
ex = "new RegExp('" + document.getElementById("regex").value + "', '" + document.getElementById("flags").value + "').";  
 
// 根据用户选择的方法, 进行相应的调用  
switch ( method )  
{  
case '0': // 正则表达式的 exec 方法  
cr = re.exec(document.getElementById("string").value);  
exex = ex + "exec('" + document.getElementById("string").value + "')";  
break;  
 
case '1': // 正则表达式的 test 方法  
cr = re.test(document.getElementById("string").value);  
exex = ex + "test('" + document.getElementById("string").value + "')";  
break;  
 
case '2': // 字符串类的 match 方法  
cr = document.getElementById("string").value.match(re);  
ex = "'" + document.getElementById("string").value + "'.match(" + re.toString() + ")";  
break;  
 
case '3': // 字符串类的 search 方法  
cr = document.getElementById("string").value.search(re);  
ex = "'" + document.getElementById("string").value + "'.search(" + re.toString() + ")";  
break;  
 
case '4': // 字符串类的 replace 方法  
cr = document.getElementById("string").value.replace(re, '<thinkbase.net>');  
ex = "'" + document.getElementById("string").value + "'.replace(" + re.toString() + ", '<thinkbase.net>')";  
break;  
 
case '5': // 字符串类的 split 方法  
cr = document.getElementById("string").value.split(re);  
ex = "'" + document.getElementById("string").value + "'.split(" + re.toString() + ")";  
break;  
}  
 
// 获得并显示表达式  
document.getElementById("expression").innerText = ex;  
 
// 获得并显示计算结果的类型  
document.getElementById("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;  
}  
 
// 获得并显示结果  
document.getElementById("matchResult").innerText = result + ' ';  
 
// 获得并显示正则表达式的lastIndex属性  
document.getElementById("lastIndex").innerText = re.lastIndex + ' ';  
}  
</SCRIPT> 
<style> 
input {  
    background:ffffff;  
    height:21;  
    padding-left:3px;  
    font-size:9pt;  
    font-family:Courier New;  
    border:1px solid #000000  
}  
textarea {  
    background:ffffff;  
    padding-left:3px;  
    font-size:9pt;  
    font-family:Courier New;  
    border:1px solid #000000  
}  
body {  
font-family: Verdana;  
font-size: 9pt;  
line-height: 170%  
}  
</style> 
</HEAD> 
 
<BODY ALIGN=CENTER> 
<FORM METHOD="post" ACTION="" ALIGN=CENTER> 
<TABLE width="100%" border="1" cellpadding="1" cellspacing="0" 
       bordercolorlight = "#C0C0C0" bordercolordark = "#FFFFFF" 
       style="font-family: Verdana; font-size: 9pt" 

<TR> 
   <TD COLSPAN="2" ALIGN="CENTER" style="font-size: 12pt; font-weight: bold">Test javascript regex</TD> 
</TR> 
<TR> 
   <TD width="30%">test regex:</TD> 
   <TD><INPUT NAME="regex" TYPE="text" size="50" ID="regex"></TD> 
</TR> 
<TR> 
   <TD>test regex flags:</TD> 
   <TD><INPUT NAME="flags" TYPE="text" size="50" ID="flags" ID="flags">('g', 'i', or 'm')</TD> 
</TR> 
<TR> 
   <TD>test string:</TD> 
   <TD><textarea name="string" rows=5 id="string" style="width:90%"></textarea></TD> 
 
</TR> 
<TR> 
   <TD>select method:</TD> 
   <TD> 
    <SELECT NAME="select" onChange="check(this.value)" ID="select" 
       style="font-family: Verdana;"> 
     <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(document.getElementById('select').value)" TYPE=button 
         style="background: #D6E7EF;  
             border-bottom: 1px solid #104A7B;border-right: 1px solid #104A7B  
                      border-left: 1px solid #AFC4D5;border-top:1px solid #AFC4D5;  
       color:#000066; font-family:Verdana;  
       19px;text-decoration:none;cursor: hand;  
       width: 60px"> 
   </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> 
分享到:
评论
1 楼 zhangshuling1214 2009-02-25  
  顶一个先

相关推荐

    好用的正则表达式测试工具

    标题“好用的正则表达式测试工具”指的是这样一种软件或在线平台,它提供了友好的界面和功能,让用户能够方便地测试自己的正则表达式,查看匹配结果,以及理解正则表达式的运行机制。 描述中的“用于测试正则表达式...

    正则表达式测试工具

    标题提到的"正则表达式测试工具",可能是一款专为测试JavaScript正则表达式设计的应用程序,它具备以下功能: 1. 输入/粘贴:用户可以输入待测试的字符串,或者直接粘贴大量文本,以便进行正则匹配操作。 2. 正则...

    deelx正则表达式测试工具

    deelx正则表达式测试工具是一款专为开发者设计的正则表达式调试软件,它提供了一个友好的界面,使得用户能够方便地测试、验证和调试正则表达式。这款工具的核心功能包括: 1. **实时测试**:输入正则表达式后,可以...

    HTML+JS 编写的正则表达式测试工具

    在这个场景中,我们有一个由 HTML 和 JS 编写的正则表达式测试工具,它允许用户输入正则表达式,并提取出文本中所有匹配的字符串。下面我们将详细讨论这个工具涉及的核心知识点。 1. **正则表达式(Regular ...

    javascript正则表达式测试工具单机版

    单机版的正则表达式测试工具,可以快速看到test和exec的结果。

    Javascript正则表达式测试网页.rar

    本压缩包“Javascript正则表达式测试网页.rar”提供了一个手册,帮助学习者深入理解和实践JavaScript中的正则表达式。 正则表达式(Regular Expression)是一种模式匹配语言,它使用特殊的字符序列来描述字符串的...

    正则表达式测试工具RegexTester 中文版

    RegexTester是一款强大的正则表达式测试工具,专为帮助用户验证和调试正则表达式设计。中文版的RegexTester使得国内用户使用起来更加便捷,无需面对语言障碍,从而提高学习和工作效率。 RegexTester提供了直观的...

    超经典正则表达式测试工具

    "超经典正则表达式测试工具"提供了对正则表达式的全方位测试和学习环境,帮助用户理解和应用正则表达式。 该工具具有以下主要功能: 1. **测试正则表达式**:用户可以输入自定义的正则表达式,然后在工具中实时...

    正则表达式测试器

    "正则表达式测试器"是一个工具,它允许用户输入正则表达式并实时测试其是否能有效匹配目标字符串,从而帮助开发者调试和优化他们的正则表达式。 正则表达式的基本概念: 1. **字符集**:正则表达式中的字符集用于...

    很强大美观的Regex正则表达式测试工具

    通过运行压缩包中的"工具_正则表达式测试.exe"文件,开发者可以直接体验这款工具的强大功能。在使用过程中,参照提供的博文链接(https://editor.csdn.net/md?not_checkout=1&articleId=122675018),可以获取更多...

    正则表达式调试工具

    综上所述,"正则表达式调试工具V3.0 绿色免费版"是一款实用的开发辅助工具,不仅提供了基本的正则表达式测试功能,还通过经典例程和跨平台特性,为开发者提供了便利的学习和调试环境。使用这款工具,开发者可以更好...

    非常有用的正则表达式测试工具

    RegexTester 是一款专为开发者和爱好者设计的正则表达式测试和调试工具。它允许用户方便地测试和验证自己的正则表达式,避免在代码中反复试验,节省了大量时间和精力。通过这个工具,你可以快速地看到正则表达式与...

    正则表达式文章和测试工具

    "正则表达式文章和测试工具"这个主题涵盖了学习正则表达式的基本概念、高级技巧,以及使用测试工具来验证和调试你的正则表达式。 首先,我们来看"正则表达式之道"系列文章。这些文件名暗示了它们可能是教程或者深入...

    RegexTool正则表达式测试小工具

    RegexTool是一款专为正则表达式测试和调试而设计的小型实用工具。它允许用户方便地验证和实验正则表达式,以确保它们能够按预期工作,并从文本或网页中提取所需的数据。在IT领域,正则表达式(Regex)是用于匹配字符...

    正则表达式测试器及教程

    在这个“正则表达式测试器及教程”中,我们将深入探讨正则表达式的概念、语法以及如何利用工具进行有效的测试。 1. **正则表达式基本概念** - **模式匹配**:正则表达式定义了一种模式,用于在文本中查找符合该...

    JS只能输入数字,数字和字母等的正则表达式

    在JavaScript(JS)中,正则表达式是一种强大的工具,用于匹配、查找、替换和验证字符串中的模式。本文将深入探讨如何使用正则表达式来限制用户在HTML文本框中只能输入数字和字母。 首先,我们需要理解正则表达式的...

    Java使用正则表达式提取XML节点内容的方法示例

    1. JavaScript正则表达式在线测试工具:http://tools.jb51.net/regex/javascript 2. 正则表达式在线生成工具:http://tools.jb51.net/regex/create_reg 这些工具可以帮助开发者快速测试和生成正则表达式,从而提高...

    正则表达式测试工具(学习正则表达式的好工具)

    标题提到的“正则表达式测试工具”是一个专门为了辅助学习和调试正则表达式而设计的应用程序。 该工具通常具有以下特性: 1. **分块界面**:描述中提到工具分为三个部分,这可能指的是输入区、测试区和结果展示区...

Global site tag (gtag.js) - Google Analytics