在线笔记 favinavi - 人性化网络收藏夹

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

分类标签：全部 CSS html javascript php/other IT

by: fanshome 2023-05-29 14:54(UTC)

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

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

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

CSS复制代码

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;
}

html复制代码

<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>

javascript复制代码

$=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('✖');
}

1255

favinavi - 重度网络用户必备在线笔记

Ubuntu 22.04 live server更换亚马逊AWS的更新源
amzon亚马逊云AWS的更新源，即使在国内速度也基本可接受，其最大特点是软件丰富，常用软件包几乎没有找不到的。具体步骤如下：
一个使用CSS/HTML将图像自适应屏幕的示例
在这个示例中，我们将图像的最大宽度设置为100%，并将高度设置为自动。此外，我们还添加了一个样式，以使图像居中于其容器元素中。这将确保图像在不同大小的屏幕上都能...
CSS3+SVG实现的带音效、会抖动的小铃铛图标特效
非常真实的抖动效果，鼠标移上去还有叮当声哦... 点“演示”按钮体验一下。
现在还有哪些好用的网络收藏夹？
看到几年前有人问过这个问题，上网搜索一下，大概能找到以下几家，目前貌似都还能访问： 1、当然有这里—— favii人性化网络收藏夹，不过最近favii升级新版...
网络收藏夹网站开发过程中PHP正则表达式忘记使用非贪婪模式带来的一次教训
新版favinavi人性化网络收藏夹网站建设初期，还没有开始宣传，就发现访问量开始8小时内达到了大几千，有点喜出望外。可是再看看又发现不对，统计的关键页面的访问...
把favinavi网络收藏夹的书签搜索功能做到最好
在此先感谢“changanluan”用户的建议，是他（她）提出了这个问题，favinavi怎么还没有书签搜索功能呢？是啊，我不属于那种要收藏几千个书签的收藏...