default
menu home
Icon library Sign up Login favorite_border message help_outline
Online notes - online bookmark

自用小工具:正则表达式测试是否能匹配字符串

styleTags: All CSS html javascript php/other IT
by: fanshome  2023-05-29 14:54(UTC)

Demo

正则表达式写起来不难,但是要做到准确无误却是一个不小的挑战,经常因为一个小疏忽,导致貌似正常而实际上却有bug。

尤其是域名或url相关的,特别容易出错,出错的主要原因是没有考虑到实际情况下的url参数中可能也包含域名。

所以自己做一个小工具,用来测试和检测写的正则表达式是否准确有效。

CSScontent_copyCopy codes
body{text-align: center;}
input,button{
	width: 96%;
	height: 30px;
	line-height: 30px;
	font-size: 24px;
	font-family:Consolas,monospace;
}
button{
	margin-top: 30px;
	padding: 8px;
	height: 46px;
	background: #098;
	color: #fff;
	border: 0;
	cursor: pointer;
}
.result{
	font-size: 24px;
	line-height: 30px;
}
.output{
	width: 30px;
	overflow: hidden;
	display: inline-block;
}
htmlcontent_copyCopy codes
<h2>待检测字符串</h2>
<input type='text' name='str' id='str' />
<h2>正则表达式pattern</h2>
<input type='text' name='reg' id='reg' /><br/>
<p class='result'>测试结果:
	<span class='output' id='output'></span>
</p>
<button class='' onclick='check()'>测试</button>
javascriptcontent_copyCopy codes
$=mdui.$;
function check(){
	var s=$('#str').val(),r=$('#reg').val();
	if(s=='' || r==''){$('#output').text('');return;}
	var flags = r.replace(/.*\/([gimy]*)$/, '$1');
	var pattern = r.replace(new RegExp('^/(.*?)/'+flags+'$'), '$1');
	var regex = new RegExp(pattern, flags);
	if(regex.test(s))$('#output').text('✔');
	else $('#output').text('✖');
}

visibility 1943


- for heavy web user Online notes
adimg
logo Post a comment

captcha
Please check the captcha code
Cancel