JavaScript中的正则表达式

最新推荐文章于 2025-03-29 16:31:02 发布

转载最新推荐文章于 2025-03-29 16:31:02 发布 · 523 阅读

javascript 同时被 2 个专栏收录

33 篇文章

订阅专栏

miaov

13 篇文章

订阅专栏

本文介绍了正则表达式的实际应用案例，包括提取字符串中的所有数字、敏感词过滤、重复字符统计等，通过具体示例讲解了不同正则方法如test、search、match和replace的使用技巧。

3找出字符串中的所有数字

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>

var str = 'haj123sdk54hask33dkhalsd879';


/*function findNum(str){
	
	var arr = [];
	
	var tmp = '';
	
	for(var i=0;i<str.length;i++){
		if( str.charAt(i)<='9' && str.charAt(i)>='0' ){
			tmp += str.charAt(i);
		}
		else{
			if(tmp){
				arr.push(tmp);
				tmp = '';
			}
		}
	}
	
	if(tmp){
		arr.push(tmp);
		tmp = '';
	}
	
	
	return arr;
	
}*/

function findNum(str){
	return str.match(/\d+/g);
}

alert( findNum(str) );   //[123,54,33,879]

</script>
</head>

<body>
</body>
</html>

正则 : 也叫做规则，让计算机能够读懂人类的规则
正则都是操作字符串的

var arr = [];
var arr = new Array();

var obj = {};
var obj = new Object();

//正则:

var re = /a/;
var re = new RegExp('a');

6正则的方法test

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>

//test : 正则去匹配字符串，如果匹配成功就返回真，如果匹配失败就返回假

//test的写法 : 正则.test(字符串)

/*var str = 'abcdef';

var re = /b/;

alert( re.test(str) );*/


//转义字符:

//alert('a\nb');

/*n \n
r \r
t \t*/

/*\s : 空格
\S : 非空格
\d : 数字
\D : 非数字
\w : 字符   ( 字母 ，数字，下划线_ )
\W : 非字符*/


var str = '374829348791';

var re = /\D/;

if( re.test(str) ){
	alert('不全是数字');
}
else{
	alert('全是数字');
}

</script>
</head>

<body>
</body>
</html>

7正则的方法search

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>

//search : 正则去匹配字符串 , 如果匹配成功，就返回匹配成功的位置，如果匹配失败就返回 -1

//search的写法 : 字符串.search(正则)

//正则中的默认 : 是区分大小写的 

//如果不区分大小写的话，在正则的最后加标识 i 

var str = 'abcdef';

var re = /B/i;

//var re = new RegExp('B','i');

alert( str.search(re) );

</script>
</head>

<body>
</body>
</html>

8正则的方法match

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>

//match : 正则去匹配字符串，如果匹配成功，就返回匹配成功的数组，如果匹配不成功，就返回null

//match的写法 : 字符串.match(正则)

//正则默认：正则匹配成功就会结束，不会继续匹配 
//如果想全部查找，就要加标识 g(全局匹配)

//量词 : 匹配不确定的位置
//+ : 至少出现一次

var str = 'haj123sdk54hask33dkhalsd879';

var re = /\d+/g;

alert( str.match(re) );   //[1]

</script>

</head>

<body>
</body>
</html>

9正则的方法replace

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>

//replace : 正则去匹配字符串，匹配成功的字符去替换成新的字符串

//replace的写法 : 字符串.replace(正则,新的字符串)

var str = 'aaa';
var re = /a+/g;

str = str.replace(re,'b');

alert(str);


</script>
</head>

<body>
</body>
</html>

10敏感词过滤

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>

//菲称仁爱礁附近17艘中国船均在菲军监视之下

//| : 或的意思

//replace : 第二个参数：可以是字符串，也可以是一个回调函数

window.onload = function(){
	var aT = document.getElementsByTagName('textarea');
	var oInput = document.getElementById('input1');
	
	var re = /菲称|中国船|监视之下/g;
	
	oInput.onclick = function(){
		
		 //aT[1].value = aT[0].value.replace(re,'*');
		 
		 aT[1].value = aT[0].value.replace(re,function(str){
		//函数的第一个参数：就是匹配成功的字符	 
		
			 //alert( str );
			 
			 var result = '';
			 
			 for(var i=0;i<str.length;i++){
				 result += '*';
			 }
			 
			 
			 return result;
			 
		 });
		
	};
	
};

</script>
</head>

<body>
替换前<br />
<textarea>
</textarea><br />
替换后<br />
<textarea>
</textarea><br />
<input type="button" value="确定" id="input1" />
</body>
</html>

18找重复项最多的字符和个数

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>

var str = 'assssjdssskssalsssdkjsssdss';

var arr = str.split('');

str = arr.sort().join('');

//alert(str);

var value = '';
var index = 0;

var re = /(\w)\1+/g;

str.replace(re,function($0,$1){
	
	//alert($0);
	
	if(index<$0.length){
		index = $0.length;
		value = $1;
	}
	
});

alert('最多的字符:'+value+',重复的次数:'+index);

</script>
</head>

<body>
</body>
</html>