整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线：

正则匹配所有url

正则匹配所有url

试一个正则，差不多能匹配所有的url。

测试url的数组

$url_arr=array(

"https://www.a12.com/url/Url-4-PU-UK-ug-AC/123.html",

"https://www.a12.com/url/url-4-pu-uk-ug-ac/123.html",

"http://www.a12.com",

"https://pan.baidu.com/s/1e11w",

"pan.baidu.com/s/1E11W",

"pan.baidu.com/s/1e11w",

'ftp://166.111.161.47',

'ftp.math.cuhk.edu.hk',

'www.baidu',

);

正则

$reg='/^((https?|ftp|news):\/\/)?([a-z]([a-z0-9\-]*[\.。])+([a-z]{2}|aero|arpa|biz|com|coop|edu|';

$reg.='gov|info|int|jobs|mil|museum|name|nato|net|org|pro|travel)|(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}';

$reg.='([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]))(\/[a-z0-9_\-\.~]+)*(\/([a-z0-9_\-\.]*)(\?[a-z0-9+_\-\.%=&]*)?)?(#[a-z][a-z0-9_]*)?$/';

便利匹配

$str='';

foreach ($url_arr as $k=> $v) {

$str .=preg_match($reg,$v);

}

var_dump($str);

结果

.正则表达式常识语法规则

  • 1.常规创建正则： var reg=new RegExp(“正则表达式”,“匹配模式”)
  • 默认正则:"/内容/" 属性为object
  • ==>检查字符串中是否含有"内容"
  • 测试方法：test() 返回一个boolean

  • “匹配模式”
  • i :(ignore) 忽略大小写
  • g :全局匹配模式

  • 字面量创建正则
  • var reg=/正则表达式/匹配模式

2.本项目完成正则一览

实现reg正则检测

(1)判断输入内容是否包含指定的内容B（忽略大小写）

//获取对象
	var input1=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input1");
	var submit1=document.querySelector("#wrap > .form-inline > .form-group > #submit1");
	var input1Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input1-show");
	//1.判断输入内容是否包含指定的内容B（忽略大小写）
	var reg1=/b/i;
	submit1.onclick=function() {
		if(reg1.test(input1.value)) {
			reg1.test(input1.value);
			input1Show.innerHTML="√";
			input1Show.style.color="green";
			input1Show.style.fontSize="20px";
			console.log("输入: ", input1.value);
		} else {
			input1Show.innerHTML="x";
			input1Show.style.color="red";
			input1Show.style.fontSize="20px";
			input1.value="";
			input1.placeholder="输入错误，请包含B";
		}

	}

reg

(2)判断输入内容是否包含指定的内容A或B（忽略大小写）

var input2=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input2");
	var submit2=document.querySelector("#wrap > .form-inline > .form-group > #submit2");
	var input2Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input2-show");
	//2.判断输入内容是否包含指定的内容A或B（忽略大小写）
	var reg2=/a|b/i;
	submit2.onclick=function() {
		if(reg2.test(input2.value)) {
			reg2.test(input2.value);
			input2Show.innerHTML="√";
			input2Show.style.color="green";
			input2Show.style.fontSize="20px";
		} else {
			input2Show.innerHTML="x";
			input2Show.style.color="red";
			input2Show.style.fontSize="20px";
			input2.value="";
			input2.placeholder="输入错误，请包含A或B";
		}

	}

reg

(3)判断字母范围 [a-y]，除[a-y]之外错误

var input3=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input3");
	var submit3=document.querySelector("#wrap > .form-inline > .form-group > #submit3");
	var input3Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input3-show");
	//3.判断字母范围 [a-y]，除[a-y]之外错误
	var reg3=/^[a-y]$/g;
	submit3.onclick=function() {
		if(reg3.test(input3.value)) {
			reg3.test(input3.value);
			input3Show.innerHTML="√";
			input3Show.style.color="green";
			input3Show.style.fontSize="20px";
		} else {
			input3Show.innerHTML="x";
			input3Show.style.color="red";
			input3Show.style.fontSize="20px";
			input3.value="";
			input3.placeholder="输入错误，字母范围 在[a-y]";
		}

	}

reg

(4)判断字母(任意字母)范围 [A-z]，包括下划线

var input4=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input4");
	var submit4=document.querySelector("#wrap > .form-inline > .form-group > #submit4");
	var input4Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input4-show");
	//4.判断字母(任意字母)范围 [A-z]，包括下划线
	var reg4=/^[A-z]{1,}$/g;
	submit4.onclick=function() {
		console.log(input4.value);
		if(reg4.test(input4.value)) {
			//判断之后，返回false，需要再次更新reg
			reg4.test(input4.value);
			input4Show.innerHTML="√";
			input4Show.style.color="green";
			input4Show.style.fontSize="20px";
		} else {
			input4Show.innerHTML="x";
			input4Show.style.color="red";
			input4Show.style.fontSize="20px";
			input4.value="";
			input4.placeholder="(任意字母)范围 [A-z]，包括下划线";
		}

	}

reg

(5)判断字符串中: 都含有a开头，c结尾 a[…]c -> abcevnthc

var input5=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input5");
	var submit5=document.querySelector("#wrap > .form-inline > .form-group > #submit5");
	var input5Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input5-show");
	//5.判断字符串中: 都含有a开头，c结尾   a[...]c -> abcevnthc
	var reg5=/^a[A-z]{1,}c$/i;
	submit5.onclick=function() {
		if(reg5.test(input5.value)) {
			//判断之后，返回false，需要再次更新reg
			reg5.test(input5.value);
			input5Show.innerHTML="√";
			input5Show.style.color="green";
			input5Show.style.fontSize="20px";
		} else {
			input5Show.innerHTML="x";
			input5Show.style.color="red";
			input5Show.style.fontSize="20px";
			input5.value="";
			input5.placeholder="(任意字母)范围 [A-z]，都含有a开头，c结尾";
		}

	}

reg

(6)判断除了[a[DNF]{1,}c$]以外的值=true

var input6=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input6");
	var submit6=document.querySelector("#wrap > .form-inline > .form-group > #submit6");
	var input6Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input6-show");
	//6.判断除了[^a[^DNF]{1,}c$]以外的值=true
	var reg6=/^a[^NDF]{1,}c$/i;
	submit6.onclick=function() {
		if(reg6.test(input6.value)) {
			//判断之后，返回false，需要再次更新reg
			reg6.test(input6.value);
			input6Show.innerHTML="√";
			input6Show.style.color="green";
			input6Show.style.fontSize="20px";
		} else {
			input6Show.innerHTML="x";
			input6Show.style.color="red";
			input6Show.style.fontSize="20px";
			input6.value="";
			input6.placeholder="不包含DNF的字符";
		}

	}

reg

(7)判断0-9任意数组[0-9]，包含[0-9]即可,且以0-9结尾

var input7=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input7");
	var submit7=document.querySelector("#wrap > .form-inline > .form-group > #submit7");
	var input7Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input7-show");
	//7.判断0-9任意数组[0-9]，包含[0-9]即可,且以0-9结尾
	var reg7=/[0-9]{1,}$/;
	submit7.onclick=function() {
		if(reg7.test(input7.value)) {
			//判断之后，返回false，需要再次更新reg
			reg7.test(input7.value);
			input7Show.innerHTML="√";
			input7Show.style.color="green";
			input7Show.style.fontSize="20px";
		} else {
			input7Show.innerHTML="x";
			input7Show.style.color="red";
			input7Show.style.fontSize="20px";
			input7.value="";
			input7.placeholder="包含[0-9]即可,且以0-9结尾";
		}

	}

reg

(8)判断单个字符 连续出现3次的c /bbb/ 或者 /b{3}/ 这里引用量词{3}，量词…{}只对前面的第一个[字符集合]起作用

var input8=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input8");
	var submit8=document.querySelector("#wrap > .form-inline > .form-group > #submit8");
	var input8Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input8-show");
	//8.判断单个字符 连续出现3次的c /bbb/ 或者  /b{3}/  这里引用量词{3}，量词...{}只对前面的第一个[字符集合]起作用
	var reg8=/c{3}/;
	submit8.onclick=function() {
		if(reg8.test(input8.value)) {
			//判断之后，返回false，需要再次更新reg
			reg8.test(input8.value);
			input8Show.innerHTML="√";
			input8Show.style.color="green";
			input8Show.style.fontSize="20px";
		} else {
			input8Show.innerHTML="x";
			input8Show.style.color="red";
			input8Show.style.fontSize="20px";
			input8.value="";
			input8.placeholder="必须带3个c";
		}

	}

reg

(9)判断多个字符 连续出现3次 /(cevent){3}/i

var input9=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input9");
	var submit9=document.querySelector("#wrap > .form-inline > .form-group > #submit9");
	var input9Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input9-show");
	//9.判断多个字符 连续出现3次  /(cevent){3}/i
	var reg9=/(cevent){3}/i;
	submit9.onclick=function() {
		if(reg9.test(input9.value)) {
			//判断之后，返回false，需要再次更新reg
			reg9.test(input9.value);
			input9Show.innerHTML="√";
			input9Show.style.color="green";
			input9Show.style.fontSize="20px";
		} else {
			input9Show.innerHTML="x";
			input9Show.style.color="red";
			input9Show.style.fontSize="20px";
			input9.value="";
			input9.placeholder="必须出现cevent这个字符串";
		}

	}

reg

(10)判断中间值 a连续出现3次ce b结尾，两边不要求 /a(ce){3}b/i

var input10=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input10");
	var submit10=document.querySelector("#wrap > .form-inline > .form-group > #submit10");
	var input10Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input10-show");
	//10.判断中间值  a连续出现3次ce b结尾，两边不要求 /a(ce){3}b/i
	var reg10=/a(ce){3}b/i;
	submit10.onclick=function() {
		if(reg10.test(input10.value)) {
			//判断之后，返回false，需要再次更新reg
			reg10.test(input10.value);
			input10Show.innerHTML="√";
			input10Show.style.color="green";
			input10Show.style.fontSize="20px";
		} else {
			input10Show.innerHTML="x";
			input10Show.style.color="red";
			input10Show.style.fontSize="20px";
			input10.value="";
			input10.placeholder="a连续出现3次ce b结尾,两边不要求";
		}

	}

reg

(11)判断中间值 连续出现1到3次，不可超过3次 /a(ce){1,3}b/ {min,max}出现次数

var input11=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input11");
	var submit11=document.querySelector("#wrap > .form-inline > .form-group > #submit11");
	var input11Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input11-show");
	//11.判断中间值  连续出现1到3次，不可超过3次 /a(ce){1,3}b/  {min,max}出现次数
	var reg11=/a(ce){1,3}b/i;
	submit11.onclick=function() {
		if(reg11.test(input11.value)) {
			//判断之后，返回false，需要再次更新reg
			reg11.test(input11.value);
			input11Show.innerHTML="√";
			input11Show.style.color="green";
			input11Show.style.fontSize="20px";
		} else {
			input11Show.innerHTML="x";
			input11Show.style.color="red";
			input11Show.style.fontSize="20px";
			input11.value="";
			input11.placeholder="连续出现1到3次(ce)";
		}

	}

reg

(12)判断中间值 最小连续出现1次以上(ce){1,} 也可以(ce)+ 符号+代表最小1

var input12=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input12");
	var submit12=document.querySelector("#wrap > .form-inline > .form-group > #submit12");
	var input12Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input12-show");
	//12.判断中间值  最小连续出现1次以上(ce){1,}  也可以(ce)+ 符号+代表最小1
	var reg12=/a(ce){1,}b/i;
	submit12.onclick=function() {
		if(reg12.test(input12.value)) {
			//判断之后，返回false，需要再次更新reg
			reg12.test(input12.value);
			input12Show.innerHTML="√";
			input12Show.style.color="green";
			input12Show.style.fontSize="20px";
		} else {
			input12Show.innerHTML="x";
			input12Show.style.color="red";
			input12Show.style.fontSize="20px";
			input12.value="";
			input12.placeholder="至少出现出现1次(ce)";
		}

	}

reg

(13)判断中间值 /a(ce)c/ 有没有都行={0,} 如果有值，必须等于=ce

var input13=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input13");
	var submit13=document.querySelector("#wrap > .form-inline > .form-group > #submit13");
	var input13Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input13-show");
	//13.判断中间值   /a(ce)*c/ 有没有都行*={0,} 如果有值，必须等于=ce
	var reg13=/a(ce)*b/i;
	submit13.onclick=function() {
		if(reg13.test(input13.value)) {
			//判断之后，返回false，需要再次更新reg
			reg13.test(input13.value);
			input13Show.innerHTML="√";
			input13Show.style.color="green";
			input13Show.style.fontSize="20px";
		} else {
			input13Show.innerHTML="x";
			input13Show.style.color="red";
			input13Show.style.fontSize="20px";
			input13.value="";
			input13.placeholder="ab*c中间值可有可无";
		}

	}

reg

(14)判断中间值 ?=0个/1个 其他都为false /ac?b/

var input14=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input14");
	var submit14=document.querySelector("#wrap > .form-inline > .form-group > #submit14");
	var input14Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input14-show");
	//14.判断中间值  ?=0个/1个 其他都为false  /ac?b/
	var reg14=/ac?b/i;
	submit14.onclick=function() {
		if(reg14.test(input14.value)) {
			//判断之后，返回false，需要再次更新reg
			reg14.test(input14.value);
			input14Show.innerHTML="√";
			input14Show.style.color="green";
			input14Show.style.fontSize="20px";
		} else {
			input14Show.innerHTML="x";
			input14Show.style.color="red";
			input14Show.style.fontSize="20px";
			input14.value="";
			input14.placeholder="ac*b中间值1个/0个c";
		}

	}

reg

(15)检查是否以a开头 ^ 区分于 [^…] 除了…都为true

var input15=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input15");
	var submit15=document.querySelector("#wrap > .form-inline > .form-group > #submit15");
	var input15Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input15-show");
	//15.检查是否以a开头   ^  区分于 [^...] 除了...都为true
	var reg15=/^a/i;
	submit15.onclick=function() {
		if(reg15.test(input15.value)) {
			//判断之后，返回false，需要再次更新reg
			reg15.test(input15.value);
			input15Show.innerHTML="√";
			input15Show.style.color="green";
			input15Show.style.fontSize="20px";
		} else {
			input15Show.innerHTML="x";
			input15Show.style.color="red";
			input15Show.style.fontSize="20px";
			input15.value="";
			input15.placeholder="以a开头";
		}

	}

reg

(16)检查是否以a结尾 $ /a$/i

var input16=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input16");
	var submit16=document.querySelector("#wrap > .form-inline > .form-group > #submit16");
	var input16Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input16-show");
	//16.检查是否以a结尾 $ /a$/i
	var reg16=/a$/i;
	submit16.onclick=function() {
		if(reg16.test(input16.value)) {
			//判断之后，返回false，需要再次更新reg
			reg16.test(input16.value);
			input16Show.innerHTML="√";
			input16Show.style.color="green";
			input16Show.style.fontSize="20px";
		} else {
			input16Show.innerHTML="x";
			input16Show.style.color="red";
			input16Show.style.fontSize="20px";
			input16.value="";
			input16.placeholder="以a结尾";
		}

	}

reg

(17)以a开头，以a结尾，中间任意字母数字 “a” /a/ /^a[A-z]{1,}a$/

var input17=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input17");
	var submit17=document.querySelector("#wrap > .form-inline > .form-group > #submit17");
	var input17Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input17-show");
	//17.以a开头，以a结尾，中间任意字母数字 "a" /a/ /^a[A-z]{1,}a$/
	var reg17=/^a[A-z0-9]{1,}a$/i;
	submit17.onclick=function() {
		if(reg17.test(input17.value)) {
			//判断之后，返回false，需要再次更新reg
			reg17.test(input17.value);
			input17Show.innerHTML="√";
			input17Show.style.color="green";
			input17Show.style.fontSize="20px";
		} else {
			input17Show.innerHTML="x";
			input17Show.style.color="red";
			input17Show.style.fontSize="20px";
			input17.value="";
			input17.placeholder="以a开头，以a结尾，中间任意字母数字";
		}

	}

reg

(18)检查字符串是否为手机号:/^1[3-9][0-9]{9}$/

var input18=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input18");
	var submit18=document.querySelector("#wrap > .form-inline > .form-group > #submit18");
	var input18Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input18-show");
	/* 18.** 检查字符串是否为手机号:/^1[3-9][0-9]{9}$/  省略{1}一个   这里引用量词{3}，量词...{}只对前面的第一个[字符集合]起作用
	 * 规则：11位			
	 * 第1位：以1开头			^1
	 * 第2位：3-9任意数字		[3-9]
	 * 第3位-第11位(9个)：任意数字  [0-9]{9}$
	 */
	var reg18=/^1{1}[3-9][0-9]{9}$/;
	submit18.onclick=function() {
		if(reg18.test(input18.value)) {
			//判断之后，返回false，需要再次更新reg
			reg18.test(input18.value);
			input18Show.innerHTML="√";
			input18Show.style.color="green";
			input18Show.style.fontSize="20px";
		} else {
			input18Show.innerHTML="x";
			input18Show.style.color="red";
			input18Show.style.fontSize="20px";
			input18.value="";
			input18.placeholder="请输入11位手机号";
		}

	}

reg

(19)19.检查字符串中是否有.

 * 任意字符：. 点
 * 使用转义字符：\
 * 判断\ 使用\\
 * 字符串中2个斜杠代表1个斜杠\
 * 如果为构造函数=new RegExp("a","i") 正则\一个斜杠，"\\"字符串中2个，正则\\斜杠，字符串中\\\\4个
12345
var input19=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input19");
	var submit19=document.querySelector("#wrap > .form-inline > .form-group > #submit19");
	var input19Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input19-show");
	/* 19.检查字符串中是否有.
	 * 任意字符：. 点
	 * 使用转义字符：\
	 * 判断\ 使用\\
	 * 字符串中2个斜杠代表1个斜杠\
	 * 如果为构造函数=new RegExp("a","i") 正则\一个斜杠，"\\"字符串中2个，正则\\斜杠，字符串中\\\\4个
	 */
	var reg19=/\./;
	//判断字符串中有.且有\ ，中间一个值[a-z]
	var reg191=/\.[a-z]\\/;
	submit19.onclick=function() {
		if(reg19.test(input19.value)) {
			//判断之后，返回false，需要再次更新reg
			reg19.test(input19.value);
			input19Show.innerHTML="√";
			input19Show.style.color="green";
			input19Show.style.fontSize="20px";
		} else {
			input19Show.innerHTML="x";
			input19Show.style.color="red";
			input19Show.style.fontSize="20px";
			input19.value="";
			input19.placeholder="请输入包含点.";
		}

	}

reg

(20)元字符

 * \b :单词边界，[word]单词前后不允许有其他字母、单词
 * \B :除了单词边界
 * \d :任意数字 [0-9]
 * \D :除了任意数字[^0-9]
 * \w :任意字母和数字，_下划线  [A-z0-9_]
 * \W ：除了字母和数字，_下划线 [^A-z0-9_]
   \s ：空格
 * \S :除了空格
12345678
var input20=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input20");
	var submit20=document.querySelector("#wrap > .form-inline > .form-group > #submit20");
	var input20Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input20-show");
	/* 元字符
	 * \b :单词边界，[word]单词前后不允许有其他字母、单词
	 * \B :除了单词边界
	 * \d :任意数字 [0-9]
	 * \D :除了任意数字[^0-9]
	 * \w :任意字母和数字，_下划线  [A-z0-9_]
	 * \W ：除了字母和数字，_下划线 [^A-z0-9_]
	   \s ：空格
	 * \S :除了空格
	 */

	//匹配任意字母  数字  可以有空格 [0-9] 可以用\d替换 ，至少有3个  /^[a-zA-Z0-9\s]{0,}$/
	var reg20=/^[a-zA-Z\d\s]{3,}$/;
	//检查任意字母或数字，包括下划线
	var reg201=/^\w{0,}$/i;
	//匹配任意字母  数字 _ 可以有空格
	var reg202=/^[\w\s]{0,}$/i;
	//单词边界：检查字符串中是否有child，/child/包含child，如果有children，则=true，不对，需要单词边界
	var reg203=/\bchild\b/;

	submit20.onclick=function() {
		if(reg20.test(input20.value)) {
			//判断之后，返回false，需要再次更新reg
			reg20.test(input20.value);
			input20Show.innerHTML="√";
			input20Show.style.color="green";
			input20Show.style.fontSize="20px";
		} else {
			input20Show.innerHTML="x";
			input20Show.style.color="red";
			input20Show.style.fontSize="20px";
			input20.value="";
			input20.placeholder="匹配任意字母  数字  可以有空格 至少有3个";
		}

	}

reg

(21)用户名输入：去除空格【改-】

var input21=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input21");
	var submit21=document.querySelector("#wrap > .form-inline > .form-group > #submit21");
	var input21Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input21-show");
	var blank21=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .blank21");
	//21.用户名输入：去除空格【改-】
	
	//判断字母、数字、空格，最小1位
	var reg21=/^[a-zA-Z0-9\s]{1,}$/;

	//str30=str29.replace(/^\s*/, "");
	//console.log("去除前缀空格：", str30);

	//str31=str30.replace(/\s*$/, "");
	//console.log("去除后缀空格：", str31);

	//去除前、中间、后 空格【这个去除是每个字母进行检查，如果是-的替换=h-e-l-l-o】 替换不可用
	//str32=str31.replace(/[\s]{0,}/g, "");
	//console.log("去除  中间  空格：", str32);

	//21.用户名输入：去除 前、后空格   重点：+ 一个或多个，* 0个或多个
	//var regBlank=/^\s*|\s{0,}$/g;
	//var strBlank="       hello children hah    ";
	//var regResult=strBlank.replace(regBlank,"");
	//console.log("去除前、后 缀空格：",regResult);

	submit21.onclick=function() {
		if(reg21.test(input21.value)) {
			reg21.test(input21.value);
			input21Show.innerHTML="√";
			input21Show.style.color="green";
			input21Show.style.fontSize="20px";
			//1.去除前后空格
			var removeFBBlank=/^\s*|\s{0,}$/g;
			var rFBB=input21.value.replace(removeFBBlank,"");
			console.log("rFBB: ",rFBB);
			//2.去除中间空格,这里也可以替换+为{1,}
			var removeMBlank=/\s+/g;
			blank21.value=rFBB.replace(removeMBlank,"-");
		} else {
			input21Show.innerHTML="x";
			input21Show.style.color="red";
			input21Show.style.fontSize="20px";
			input21.value="";
			input21.placeholder="只能输入数字、字母、空格";
		}

	}

reg

(22)22.电子邮箱:cevent .163 @ ccc .com .cn

 * 第一组：任意字母数字 	[a-zA-Z0-9]{3,10}
 *      |- 字母+数字+下划线=\w{3,10}  长度[最短3-10]
 * 第二组：.任意字母数字下划线  (\.\w)  整体可有可无
 * 		|- (\.\w){0,10}
 * 第三组：@
 * 		|- @
 * 第四组：任意字母数字 [a-zA-Z0-9] 长度[1-11]
 * 		|- [a-zA-Z0-9]{1,11}
 * 第五组：.任意字母 [a-zA-Z] 长度[最短2][最长5]
 * 		|- [\.a-zA-Z]{2,5}
 * 第六组：.任意字母 [a-zA-Z] 长度[最短2][最长5]与上一个相同，更新上一个正则
 * 		|- (\.[a-zA-Z]{2,5}){1,2}
 * 注意：整个开头结尾约束: ^()$
12345678910111213
var input22=document.querySelector("#wrap > .form-inline > .form-group > .input-group > #input22");
	var submit22=document.querySelector("#wrap > .form-inline > .form-group > #submit22");
	var input22Show=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .input22-show");
	var blank22=document.querySelector("#wrap > .form-inline > .form-group > .input-group > .blank22");
	
	var reg22=/^[a-zA-Z0-9]{3,10}(\.\w{0,10})@[a-zA-Z0-9]{1,11}(\.[a-zA-Z]{2,5}){1,2}$/;

	submit22.onclick=function() {
		if(reg22.test(input22.value)) {
			reg22.test(input22.value);
			input22Show.innerHTML="√";
			input22Show.style.color="green";
			input22Show.style.fontSize="20px";
			
		} else {
			input22Show.innerHTML="x";
			input22Show.style.color="red";
			input22Show.style.fontSize="20px";
			input22.value="";
			input22.placeholder="邮箱：cevent.163@ccc.com.cn";
		}

	}

reg

3.less布局


* {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
    body {
        height: 100%;
        #wrap {
            width: 900px;
            height: 1100px;
            border: 5px solid steelblue;
            border-radius: 2%;
            background: seashell;
            box-shadow: 2px 2px 5px #000000;
            left: 0;
            top: 0;
            right: 0;
            bottom: 0;
            margin: 2% auto;
            //text-align: center;
            transition: 2s;
            .ct {
                text-align: center;
                margin: 10px auto;
            }
            .cps {
                margin-left: 60%;
            }
            &:hover {
                background: snow;
            }
            .form-inline{
                 margin-left: 10px;
                .form-group{
                    margin: 5px auto;
                }
            }
        }
    }
}

2.html

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no" />
		<title>正则表达式全校验</title>
		<link rel="stylesheet" href="../less/6-bootstrap/css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/3-js-Reg-input.css" />

		<body>
			<div id="wrap">
				<h1 class="ct common-title">正则表达式REG-22种校验规则详解，并扩展10个正则</h1>
				<h3 class="cps common-ps">一刀coder</h3>
				<form class="form-inline">
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">1.判断输入内容是否包含指定的内容B（忽略大小写）：</div>
							<input id="input1" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input1-show input-group-addon"></div>
						</div>
						<button id="submit1" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">2.判断输入内容是否包含指定的内容A或B（忽略大小写）：</div>
							<input id="input2" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input2-show input-group-addon"></div>
						</div>
						<button id="submit2" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">3.判断字母范围 [a-y]，除[a-y]之外错误：</div>
							<input id="input3" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input3-show input-group-addon"></div>
						</div>
						<button id="submit3" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">4.判断字母(任意字母)范围 [A-z]，包括下划线：</div>
							<input id="input4" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input4-show input-group-addon"></div>
						</div>
						<button id="submit4" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">5.判断字符串中: 都含有a开头，c结尾 a[...]c: </div>
							<input id="input5" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input5-show input-group-addon"></div>
						</div>
						<button id="submit5" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">6.判断除了[^a[^DNF]{1,}c$]以外的值=true: </div>
							<input id="input6" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input6-show input-group-addon"></div>
						</div>
						<button id="submit6" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">7.判断0-9任意数组[0-9]，包含[0-9]即可,且以0-9结尾: </div>
							<input id="input7" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input7-show input-group-addon"></div>
						</div>
						<button id="submit7" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">8.判断单个字符 连续出现3次的c: </div>
							<input id="input8" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input8-show input-group-addon"></div>
						</div>
						<button id="submit8" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">9.判断多个字符 连续出现3次  /(cevent){3}/i: </div>
							<input id="input9" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input9-show input-group-addon"></div>
						</div>
						<button id="submit9" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">10.判断中间值 a连续出现3次ce b结尾，两边不要求: </div>
							<input id="input10" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input10-show input-group-addon"></div>
						</div>
						<button id="submit10" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">11.判断中间值 连续出现1到3次，不可超过3次 /ace{1,3}b/ {min,max}出现次数: </div>
							<input id="input11" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input11-show input-group-addon"></div>
						</div>
						<button id="submit11" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">12.判断中间值 a 最小连续出现1次以上ce b: </div>
							<input id="input12" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input12-show input-group-addon"></div>
						</div>
						<button id="submit12" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">13.判断中间值 /a(ce)*c/ 有没有都行*={0,} 如果有值，必须等于=ce : </div>
							<input id="input13" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input13-show input-group-addon"></div>
						</div>
						<button id="submit13" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">14.判断中间值 ?=0个/1个 其他都为false /ac?b/ : </div>
							<input id="input14" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input14-show input-group-addon"></div>
						</div>
						<button id="submit14" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">15.检查是否以a开头 ^ 区分于 [^...] 除了...都为true : </div>
							<input id="input15" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input15-show input-group-addon"></div>
						</div>
						<button id="submit15" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">16.检查是否以a结尾 $ /a$/i : </div>
							<input id="input16" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input16-show input-group-addon"></div>
						</div>
						<button id="submit16" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">17.以a开头，以a结尾，中间任意字母数字 "a" /a/ /^a[A-z]{1,}a$/ : </div>
							<input id="input17" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input17-show input-group-addon"></div>
						</div>
						<button id="submit17" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">18.检查字符串是否为手机号:/^1[3-9][0-9]{9}$/ : </div>
							<input id="input18" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input18-show input-group-addon"></div>
						</div>
						<button id="submit18" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">19.检查字符串中是否有. : </div>
							<input id="input19" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input19-show input-group-addon"></div>
						</div>
						<button id="submit19" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">20.匹配任意字母 数字 可以有空格 [0-9] 可以用\d替换 ，至少有3个 /^[a-zA-Z0-9\s]{0,}$/ : </div>
							<input id="input20" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input20-show input-group-addon"></div>
						</div>
						<button id="submit20" type="button" class="btn btn-primary">检查</button>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">21.用户名输入：去除空格 : </div>
							<input id="input21" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input21-show input-group-addon"></div>
						</div>
						<button id="submit21" type="button" class="btn btn-primary">去空格</button>
						<div class="input-group">
							<span class="input-group-addon" id="basic-addon1">去掉空格后</span>
							<input type="text" class="blank21 form-control" placeholder="点击去空格查看" aria-describedby="basic-addon1">
						</div>
					</div>
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon">22.电子邮箱验证xxx.x@x.x.x : </div>
							<input id="input22" type="text" class="form-control" id="exampleInputAmount" placeholder="请输入">
							<div class="input22-show input-group-addon"></div>
						</div>
						<button id="submit22" type="button" class="btn btn-primary">检查</button>
					</div>

				</form>
			</div>

		</body>
		<script type="text/javascript" src="../less/6-bootstrap/js/jquery.min.js"></script>
		<script type="text/javascript" src="../less/6-bootstrap/js/bootstrap.min.js"></script>
		<script type="text/javascript" src="js/3-js-Reg-input.js"></script>

</html>

牢记去空格正则不降薪！不收藏关注转发用到了找不到哦~

代码如下：

#以下代码是通过python的正则表达式re模块匹配出html标签以及内容
import re #必须导入内置的正则表达式re模块
info='<html><h2>zhangsan</h2></html>'
#上面一行代码定义info为html标签内容，包含2个标签，第1个标签是html,第2个标签是h2，标签内容是zhangsan
pattern1=re.compile(r'<(\w+)><(\w+)>(.+)</\2></\1>$')
#上面这行代码的(\w+)代表至少1个数字字母下划线，(.+)匹配除换行符 \n 之外的任何至少1个单字符，</\2>代表第2个标签的</h2>,</\1>代表第1个标签的</html>
result1=re.match(pattern1,info)
#上面这行代码代表从头开始匹配info里符合正则规则pattern1的内容，并赋值给result1
print("result1:",result1)
print("result1.group():",result1.group())
#上面这行代码代表要打印匹配出来的所有结果，group()代表所有的
print("result1.group(1):",result1.group(1))
#上面这行代码代表要打印匹配出来的第一个结果，group(1)代表第一个结果
print("result1.group(2):",result1.group(2))
#上面这行代码代表要打印匹配出来的第二个结果，group(2)代表第二个结果
print("result1.group(3):",result1.group(3))
#上面这行代码代表要打印匹配出来的第三个结果，group(3)代表第三个结果

代码运行结果如下：

result1: <re.Match object; span=(0, 30), match='<html><h2>zhangsan</h2></html>'>

result1.group(): <html><h2>zhangsan</h2></html>

result1.group(1): html

result1.group(2): h2

result1.group(3): zhangsan

图片示例如下：


在线咨询
上一篇：纯CSS 实现格子背景（国际象棋棋盘） - 掘金
下一篇：几款开源的报表工具

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

推荐阅读
友情链接 蜀山区 临西县 临翔区 云梦县 索县 新郑市 网站制作
Copyright © 2002-2019 雨点网络设计有限公司 版权所有   冀ICP备11025394号
联系电话：   E-mail：279303980@qq.com  
主营业务：技术文章网站建设、网站定制、技术文章营销型网站建设、技术文章网站优化、技术文章微商城制作、三级分销系统开发
电话沟通
在线客服