JavaScript学习笔记--正则,

1,正则
+匹配前面的子表达式出现一次或多次。要匹配 + 字符,请使用\ +。
[^abc] 表达式用于查找任何不在方括号之间的字符。^匹配输入字符串的开始位置,除非在方括号表达式中使用,此时它表示不接受该字符集合
.匹配除“\n”和"\r"之外的任何单个字符。
*号代表字符可以不出现,也可以出现一次或者多次(0次、或1次、或多次)。
? 问号代表前面的字符最多只可以出现一次(0次、或1次)
\d匹配一个数字字符。等价于[0-9]。
\D匹配一个非数字字符。等价于[^0-9]。
{n}n是一个非负整数。匹配确定的n次。
{n,}n是一个非负整数。至少匹配n次。
{n,m}m和n均为非负整数,其中n<=m。最少匹配n次且最多匹配m次。

test() 方法用于检测一个字符串是否匹配某个模式.
如果字符串中有匹配的值返回 true ,否则返回 false。

var str = "1a1b1c";
var reg = /1./;
console.log(reg.test(str)) //true

exec 查找并返回当前的匹配结果,并以数组的形式返回,没有返回 null。

var str = "1a1b1c";
var reg = /1./;
var arr = reg.exec(str)[0];  //la
如果不存在,则 arr 为 null,否则 arr 总是一个长度为 1 的数组
exec 方法受参数 g 的影响。若指定了 g,则下次调用 exec 时,会从上个匹配的 lastIndex 开始查找。
var str = "1a1b1c";
var reg = /1./;
var arr = reg.exec(str)[0];  //1a
var arr1 = reg.exec(str)[0]; //1b

match 是 String 对象的一个方法。 exec 是 RegExp 对象的方法。二者还有一个不同点,就是对参数 g 的解释。 如果指定了参数 g,那么 match 一次返回所有的结果。

var str = "1a1b1c";
var reg = new RegExp("1.","");
var arr = str.match(reg)[0];     //1a

var str = "1a1b1c";
var reg = new RegExp("1.","g");
var arr = str.match(reg);    //[1a,1b,1c]
g,全局匹配,i不区分大小写,m执行多行匹配,用最多的为g和i

正则表达式有子表达式(小括号内的内容)

var str = "1abc3,2abc8";
var reg = /a(bc)/;
var arr = reg.exec(str);      //abc ,bc
var arr1 = str.match(reg);   //abc, bc

var str = "1abc3,2abc8";
var reg = /a(bc)/g;
var arr = reg.exec(str);     //abc ,bc
var arr1 = str.match(reg);  //abc ,abc

exec与全局是否定义无关系,而match则于全局相关联,当定义为非全局,两者执行结果相同

()的使用

var reg = /^I (love|like) you$/
console.log(reg.test("I love you"))  //true
console.log(reg.test("I like you"))  //true

var reg = /^\d{4}-\d{2}-\d{2}$/
var str = '2015-14-25';
console.log(str.match(reg)) 
// ["2015-14-25", index: 0, input: "2015-14-25", groups: undefined]

如提取出年、月、日,

var reg = /^(\d{4})-(\d{2})-(\d{2})$/
var str = '2015-14-25';
console.log(str.match(reg)) 
//  ["2015-14-25", "2015", "14", "25", index: 0, input: "2015-14-25", groups: undefined]

想把yyyy-mm-dd格式,替换成mm/dd/yyyy

var reg = /^(\d{4})-(\d{2})-(\d{2})$/
var str = '2015-14-25';
console.log(str.replace(reg,"$2/$3/$1")) 
// 14/25/2015
replace中的,第二个参数里用$1、$2、$3指代相应的分组

yyyy-mm-dd或yyyy/mm/dd或yyyy.mm.dd

var reg = /\d{4}(-|\.|\/)\d{2}\1\d{2}/
var str1 = '2015-14-25';
var str2 = '2015/14/25';
var str3 = '2015.14.25';
var str4 = '2015-14/25';
console.log(reg.test(str1))  //true
console.log(reg.test(str2))  //true
console.log(reg.test(str3))  //true
console.log(reg.test(str4))  //false
\1,表示的引用之前的那个分组(-|\/|\.)。不管它匹配到什么(比如-),\1都匹配那个同样的具体某个字符。

2,判断日期是否有效

	function isValidDate(value, userFormat){
			userFormat = userFormat || 'dd/mm/yyyy';
			var delimiter = /[^mdy]/.exec(userFormat)[0]; //用于分割字符串
			var realFormat = userFormat.split(delimiter); //分割字符串
			var realDate = value.split(delimiter);
			
			function isDate(date, format){
				var m, d, y, i = 0, len = format.length, f;
				for(i; i<len; i++){
					f = format[i];
					if(/m/.test(f)) m = date[i];
					if(/d/.test(f)) d = date[i];
					if(/y/.test(f)) y = date[i];
				}
				return(
					m > 0 && m < 13 && y && y.length ===4 
					&& d > 0 && d <= (new Date(y, m, 0)).getDate()
				);
			}
			return isDate(realDate, realFormat)
	 }
		
	isValidDate('23/11/2012','')  // true
	isValidDate('31-11-2012','dd-mm-yyyy') // false

3.高亮文本

function highlight(text, words, tag){
	tag = tag || 'span';
	var i, len = words.length, re;
	for(i=0; i<len; i++){
		re = new RegExp(words[i], 'g');
		if(re.test(text)){
			text = text.replace(re, '<' + tag + ' class="highlight">$&</' + tag + '>');
		}
	}
	return text;
}
$('p').html( highlight(
	$('p').html(),
	['foo','bar','baz', 'hello world'],
	'strong'
))

去除高亮

function unhighlight(text,tag){
	tag = tag || 'span';
	var re = new RegExp('(<' + tag + '.+?>|<\/'+ tag + '>)','g');
	return text.replace(re, '');
}

4,全局计数

function myCounter(){
	$("#c").data('counter',0).click(function(){
		var counter = $("#c").data('counter');
		$("#c").data('counter', ++counter)
		
	})
}
function getCounter(){
	var c = $("#c").data('counter');
	console.log(c,"c----------")
}

$(selector).data(name,value)向被选元素附加数据
name 必需。规定要设置的数据的名称。
value 必需。规定要设置的数据的值。
$(selector).data(name)从被选元素中返回附加的数据。
name
可选。规定要取回的数据的名称。
如果没有规定名称,则该方法将以对象的形式从元素中返回所有存储的数据。

猜你喜欢

转载自blog.csdn.net/yzx15855401351/article/details/85100280
今日推荐