正则表达式基础 正则表达式是一种微型语言 正则对于字符串的验证,替换,修改,切换数组等功能 写法: var reg=/ 正则内容 /修饰符 var reg=new RegExp(“正则内容”,“修饰符”) 修饰符是针对正则的一种功能增强 g 全局匹配 i 不区分大小写 m 执行多行匹配
正则表达式表示方法: var reg=/a/gi;//查找全局字符串中不分大小写所有的Aa var str=“defAbgac”;
var reg=/a/g;//查找是否含有a console.log(reg.test(“asdjhas”)) 判断字符串中是否满足正则表达式,返回布尔值 console.log(reg.exec(“ajksdsakjd”)); 将字符串中满足正则表达式的内容转换为一个数组,包括有这个字符,整个字符串,群组和下标 reg.exec(“fgrhjdm”)//索引下标如果加g会找到最后一个的下标,没有g则是第一个的下标
判断是否含有某个字符串 if(str.indexOf(“a”)>-1){ } if(str.includes(“a”)){} if(/a/i.test(str)){}
字符串使用正则方法 search 找到满足正则元素起始字符的下标,返回字符串中第一个匹配项的索引,没有匹配项返回-1
match 将字符串中满足正则内容的元素放入在数组中
var str="3[ab]4[cd]"; var arr=str.match(/\[[a-z]+\]/g); console.log(arr);replace 替换
var str="<a>asdasd</a><div>wqedfdfs</div>"; str=str.replace(/\<\/?[a-z]+\>/g,function(item){ return item.toUpperCase(); }); console.log(str);split字符分割为字符串数组
var str="a,b,c"; var arr=str.split(","); console.log(arr); var str="ab+cd|ef-g"; var arr=str.split(/[+|-]/g); console.log(arr);元字符 像/cat/这种的就是就是元字符
console.log(“catcot”.match(/cat/));//能查到cat //在字符串中查找对应的字符,/cat/是元字符 console.log(“catcot”.match(/c.t/g));//能查到cat和cot //通配符.代表任意个字符 console.log(“catc.tcot”.match(/c.t/g));//查找c.t,将通配符.转义为字符串. console.log(“c\\t”.match(/c\\\\t/g)); console.log(“catcrtcot”.match(/c[oa]t/g));//查找cot和cat不要crt,[]中的字符代表任意一个[]内的字符 console.log(“catcrtc.tcot”.match(/c[oa.]t/g));//查找cot和cat和c.t不要crt,中括号中的.不需要转义,就是字符串,不再拥有通配符概念 console.log(“catcbtcctcdtcet”.match(/c[a-d]t/g));//从a-d console.log(“12314catcrtc.tcot41345435”.match(/[0-9]/g));匹配数字 console.log(“123146783743741345435”.match(/[0-79]/g));//不要8,表示0-7和一个9 console.log("\.".match(/./g));//代表一个斜杠一个. console.log(“acbdass”.match(/[acbdass]/g));//在[]中重复无用,与[acbds]一样 console.log(“3[ab]5[cd]”.match(/[[a-d][a-d]]/g));
反义字符串^ 使用时要注意范围的精准 console.log(“catcbtcctcdtcetcft”.match(/c[e]t/g));//表示中括号内取反,表示这里的内容不要 console.log(“emfijooddvvadsbjheihoscievyoeivto”.match(/[b-df-hj-np-tv-z]/g));//不要aeiou console.log(“abcmsofnapeebea”.match(/c[ae]t/g));//如果上箭头不在中括号第一位,则表示字符^ //[^]等同于[^]表示不要上箭头
// [a-zA-Z0-9] \w 字符a-zA-Z0-9 // [^a-zA-Z0-9] \W 非a-zA-Z0-9字符 // [0-9] \d 数字 // [^0-9] \D 非数字 // \s 空白字符 // \S 非空白字符
console.log(" ab cd".match(/\s/g).join(""));//字符串除去空格input输入框输入内容禁止输入空格 var input=document.querySelector(“input”); input.addEventListener(“input”,inputHandler); 方法1
function inputHandler(e){ var arr=input.value.match(/\S/g); input.value=arr ? arr.join("") : ""; }方法2
function inputHandler(e){ input.value=input.value.replace(/\s/g,""); }重复
console.log(“aaabbbcc”.match(/a{3}b{3}c{2}/g)); 日期型2020-10-20 console.log(/\d{4}(-\d{2}){2}/);
a{0}===.{0}===f{0} 任意字符{0},都表示匹配空字符串重复次数的范围 贪婪,非贪婪 console.Log(“aaaaaaa”.match(/a{3,6}/g));//最少重复3次,最多重复6次,aaa aaaa aaaaa aaaaaa满足 console.Log(“a222222222222b”.match(/a2{1,}b/g));//表示可以有许多2 console.log(“2[abc]3[cdefg]4[ab]”.match(/[[a*-z]{1,}]/g))
{0,}可以用*来代替表示有没有,{1,}用+代替,表示至少有1个,{0,1}用?代替表示有没有
将[]换为<> 将小写字母换为大写字母 var str=“2[abc]3[cdefg]4[ab]5[]” str=str.replace(/[[a-z]{0,}]/g,function(item,index,str){ // return “<”+item.slice(1,-1)+">"; return item.toUpperCase(); }); console.log(str);
案例: 添加删除元素的class名
<div class="div1 div2 div3 div4"></div> function addClass(elem,className){ return className.match(/\S+/g).reduce(function(value,item){ if(value.indexOf(item)<0) value.push(item); return value; },elem.className.match(/\S+/g)).join(" "); } function removeClass(elem,className){ return className.match(/\S+/g).reduce(function(value,item){ var index=value.indexOf(item); if(index>-1) value.splice(index,1); return value; },elem.className.match(/\S+/g)).join(" "); } var div=document.querySelector("div"); div.className=removeClass(div,"div3 div5 div7 div1 ");