用JavaScript写一个正则表达式测试工具

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>正则表达式测试</title><style type="text/css">.ZZ{font-size: 14.5px;width: 600px;height: 500px;margin: 20px auto;}.title{color: #FF0000;text-align: center;}.textbox{height: 200px;border: 2px solid #ccc;border-radius: 5px;padding: 5px;width: 586px;}.result{height: 200px;border: 2px solid #ccc;border-radius: 5px;padding: 5px;width: 586px;}p{margin-right: 1px;}</style></head><body><div class="ZZ"><h2 class="title">正则表达式测试工具</h1><textarea class="textbox"  placeholder="请输入待匹配的文本" id="usertext"></textarea><p>正则表达式：<input type="text" placeholder="请输入正则表达式" id="regexp"/><input type="checkbox" name="flag" value="i" />忽略大小写<input type="checkbox" name="flag" value="g" />全局搜索<input type="checkbox" name="flag" value="m" />多行搜索<input type="button" name="btn" id="btn" value="测试匹配" /></p><textarea id="result" class="result" ></textarea></div><script>var usertext=document.getElementById("usertext");var regexp=document.getElementById("regexp");var btn=document.getElementById("btn");var result=document.getElementById("result");var flag=document.getElementsByName("flag");var pattern;var FLAG="";for(var i=0;i<flag.length;i++){flag[i].onclick=function(){FLAG="";for(var j=0;j<flag.length;j++){if(flag[j].checked){FLAG+=flag[j].value;}}}}var startmat=function(){pattern=new RegExp(regexp.value,FLAG);result.value=pattern.exec(usertext.value)||"没有匹配";}btn.addEventListener("click",startmat);</script></body>
</html>

主要知识点：

RegExp的创建
var pattern=new RegExp(string,flag)
给多选按钮添加点击事件
用循环来给每个按钮添加点击事件，每一个点击事件添加前，都先将存放flag值的字符串清空（防止多个相同事件的叠加），然后内层循环来遍历每一个按钮的状态值（checked==true），然后添加到字符串中。

用JavaScript写一个正则表达式测试工具相关推荐

正则表达式测试工具 Regex Tester 的使用方法
2019独角兽企业重金招聘Python工程师标准>>> 正则表达式测试工具"RegexTester",下载地址:http://www.oschina.net/p/ ...
python测试开发自学教程-Web开发哪家强？看我用 Python 写一个颜值测试小工具
我们知道现在有一些利用照片来测试颜值的网站或软件,其实使用 Python 就可以实现这一功能,本文我们使用 Python 来写一个颜值测试小工具. 简介要实现颜值测试功能,大致有两种方式:一种是自己 ...
利用 Python 写一个颜值测试小工具
我们知道现在有一些利用照片来测试颜值的网站或软件,其实使用 Python 就可以实现这一功能,本文我们使用 Python 来写一个颜值测试小工具. 很多人学习python,不知道从何学起. 很多人学习 ...
用 Python 写一个颜值测试小工具
我们知道现在有一些利用照片来测试颜值的网站或软件,其实使用 Python 就可以实现这一功能,本文我们使用 Python 来写一个颜值测试小工具. 简介要实现颜值测试功能,大致有两种方式:一种是自己 ...
python小测试8_用 Python 写一个颜值测试小工具
我们知道现在有一些利用照片来测试颜值的网站或软件,其实使用 Python 就可以实现这一功能,本文我们使用 Python 来写一个颜值测试小工具. 简介要实现颜值测试功能,大致有两种方式:一种是自己 ...
python测试开发小工具_Web开发哪家强？看我用 Python 写一个颜值测试小工具
我们知道现在有一些利用照片来测试颜值的网站或软件,其实使用 Python 就可以实现这一功能,本文我们使用 Python 来写一个颜值测试小工具. 简介要实现颜值测试功能,大致有两种方式:一种是自己 ...
用 Python 写一个颜值测试小工具！你的颜值有几分了？
我们知道现在有一些利用照片来测试颜值的网站或软件,其实使用 Python 就可以实现这一功能,本文我们使用 Python 来写一个颜值测试小工具. 简介要实现颜值测试功能,大致有两种方式:一种是自己 ...
正则表达式测试工具、网页版
有时候为了测试正则表达式.临时自己写了这么一个.我对于JS也不懂.所以写的很差.. 代码:(我测试在IE8中是正常的.然而在我的FireFox中的.却无法使用.原因不明.这个我也不管了.反正就自己用用 ...
正则表达式测试工具模仿
学习进入下个阶段,对在线正则表达式测试工具进行仿写. 原版链接如下:正则表达式 – 开源中国测试工具一.HTML表单格式及CSS样式详细略关键点1 HTML结构及ID.class.value名称 ...

用JavaScript写一个正则表达式测试工具

用JavaScript写一个正则表达式测试工具相关推荐

最新文章

热门文章