扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
首先肯定的是JavaScript中是可以使用正则表达式的。
成都创新互联公司成立与2013年,先为丰南等服务建站,丰南等地企业,进行企业商务咨询服务。为丰南企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。
下面我就借鉴秒秒学上的内容,简单说下。
在没有了解正则表达式之前,是很难理解它的强大功能的,我们先来看一个在JavaScript中使用正则表达式的语句。
//创建正则表达式,这和声明字符串很相似,但hello不是放在双引号中,而是在双斜杠中’//’。
var myRE = /hello/;
示例中创建正则表达式的代码其实是简写,完整写法为:var myRE = new RegExp(“hello”);
/*
*使用正则表达式在字符串中查找信息。
*下面代码使用test方法匹配字符串,这里在myString中匹配myRE中的”hello”字符串,
*若myString中能匹配到test方法,则返回true,否则返回false。匹配过程是大小写敏
*感的。
*/
var myString = “Does this sentence have the word hello in it?”
if( myRE.test(myString) ) {
alert(“Yes”);
}
test方法只返回true和false,而使用search方法能返回”hello”在myString中第一次出现的下标。
介绍了JavaScript中使用正则表达式的用法后,下面我们来说下正则表达式本身。
在刚刚的示例中,我们用正则表达式匹配的是字符串hello。但很多时候需要匹配的字符串是比较复杂的,如电子邮箱的格式。这时我们就要使用由普通字符以及特殊字符组成的文字模式。特殊字符也许对不了解正则表达式的人来说就是一串乱七八糟的字符,但其实就是因为有了这些乱糟糟的字符,才能使正则表达式好些的强大。下面我们来了解下正则表达式中的特殊字符:
通过普通字符以及特殊字符可以组成复杂的正则表达式。如下是一个逐渐复杂的示例:
其实上面的正则表达式并不算复杂。很多常用的正则表达式可以在网上找到,不用我们自己编写,如:
匹配电子邮箱:/^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/
匹配URL:/^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/
复杂正则表达式的编写并不简单,题主只要先大概的了解即可,希望能帮助你入门,推荐你去一个不错的自学网站 秒秒学上过一遍基础知识。
[img]JavaScript通过RegExp类来支持正则表达式,举一个最简单的例子:
复制代码
代码如下:
var
regApple
=
new
RegExp("apple");
它可以匹配一个字符串中出现的第一个"apple"字符串,并且对大小写敏感。在构造方法中加入第二个参数"g"则代表的搜索出字符串中所有的
"apple",这里"g"代表"global"。如果第二个参数为"i",则代表着case-insensitive,匹配过程中将不考虑字母的大小写。将上述两者综合起来,可以搜索出所有"apple"字符串,并且不考虑大小写问题。
复制代码
代码如下:
var
regApple
=
new
RegExp("apple",
"gi");
正则表达式有着并不唯一的表示方法,使用Perl语言中的语法,可以将上述表达式表示为:
复制代码
代码如下:
var
regApple
=
/apple/gi;
创建了一个RegExp对象后,RegExp的方法可以构造出不同的匹配方式,因为正则表达式是对字符串进行的操作,所以String的一些方法在构造正则表达式的过程中也扮演着重要角色。
RegExp对象的方法
复制代码
代码如下:
var
sampleString
=
"Greenapple";
var
regApple
=
/apple/;
alert(regApple.test(sampleString));
上面代码输出的结果是"true",因为sampleString中包含了需要匹配的字符串"apple",这是最简单的检测方式。有时,我们需要知道匹配的详细结果,例如:
复制代码
代码如下:
var
sampleString
=
"green
apples,
red
apples";
var
regApple
=
/apple/g;
var
arr
=
regApple.exec(sampleString);
通过使用exec()方法,返回的arr是关于匹配结果的一个数组,包括每一个匹配的值及其所在的段,例如上例中是"green
apples"还是"red
apples"。match()方法有着和exec()相同的功能,只是表达方式不同:
复制代码
代码如下:
var
sampleString
=
"green
apples,
red
apples";
var
regApple
=
/apple/g;
var
arr
=
sampleString.match(regApple);
search()方法和indexOf()比较类似,返回第一个匹配的字符串所在的位置:
复制代码
代码如下:
var
sampleString
=
"green
apples,
red
apples";
var
regApple
=
/apple/gi;
alert(sampleString.search(regApple));
//输出"6"
String的方法
String的replace()方法可以将指定的字符串替换为另一个字符串:
复制代码
代码如下:
var
sampleString
=
"There
is
a
green
apple.";
alert(sampleString.replace("green",
"red"));
//输出"There
is
a
red
apple."
将replace()的第一个参数替换为一个正则表达式,可以达到同样的效果:
复制代码
代码如下:
var
sampleString
=
"There
is
a
green
apple.";
var
regApple
=
/apple/;
alert(sampleString.replace(regApple,
"red"));
//输出"There
is
a
red
apple."
replace()的第二个参数可以替换为一个function(),该function()接受一个匹配字符串作为参数,返回一个替换字符串。(存在疑问)
使用正则表达式可以实现String的split()方法相同的功能。
复制代码
代码如下:
var
fruit
=
"apple,pear,lemon";
var
arr
=
fruit.split(",");
使用正则表达式:
复制代码
代码如下:
var
fruit
=
"apple,pear,lemon";
var
reg
=
/\,/;
var
arr
=
fruit.split(reg);
我这里给你写了一个例子
var reg = /^[a-zA-Z]$/;// 这里是 正则表达式,大小写英文字母都可以
if (reg.test(userName.value) != true) {
alert("用户应为全英文");
}
希望对你有用,如果还有问题,请继续追加问题
“?:”是“非获取存储匹配”的意思
“ ?:” 只在一个“()”group中,紧贴着“(”出现,例如“(?:abcdefg)”,不同于“ ? ”, “?: ”不是一个量词,但是与“()”共同构造一个元字符,这个元字符所匹配出来的结果,不会保留,也不能参与诸如替换计算等等的操作。(这个操作在服务端多见一些,前端用的不多)(javascript只有string对象的replace方法能用到这个功能)
简单来说,就是你的正则表达式如果用不着在javascript里面使用replace方法,“?:”就可以省去(当然,看个人喜好和排版习惯,还有调试中的页面响应速度,如果加了“?:”反而更快,那就用吧)。
这么说起来还是比较抽象,用实例代码来说明吧。
!DOCTYPE html
html
head
meta charset="utf-8"
title/title
/head
body
p将匹配的数字增加后缀“9”/p
p class="demo"/(\d+)/gi:A23G4HFD567./p
p class="demo"/(?:\d+)/gi:A23G4HFD567./p
button onclick="myFunction()"点我/button
script
function myFunction(){
var e=document.getElementsByClassName("demo");
var str=e[0].innerHTML;
var n=str.replace(/(\d+)/gi,"$19");
e[0].innerHTML=n;
str=e[1].innerHTML;
var n=str.replace(/(?:\d+)/gi,"$19");
e[1].innerHTML=n;
}
/script
/body
/html
!----
!--在实例里面“$1代表第一个“()”所匹配的结果--
点击“点我”按钮前
点击“点我”按钮后
可以看到“/(\d+)/gi”所匹配的结果被用于扩展替换字符串中的“$1”;
但是“/(?:\d+)/gi”所匹配的结果没有被用于扩展替换字符串中的“$1”,尽管,它也成功地找到了被查找字符串中的数字,显然结果没有被保留。
对了,类似的问题,可以用这种办法去对比验证。(比如“?=”、“?!”、“?=”、“?!”是什么意思……)
上图是在菜鸟教程找到的一个比较全面的正则表达式的元字符列表的部分:
还有,不同软件的正则表达式的可能有不同的特性,但是目前perl的正则表达式是公认最多特性的。
亲爱的读者朋友,如果你点开了这篇文章,说明你对正则很感兴趣。
想必你也了解正则的重要性,在我看来正则表达式是衡量程序员水平的一个侧面标准。
关于正则表达式的教程,网上也有很多,相信你也看了一些。
与之不同的是,本文的目的是希望所有认真读完的童鞋们,都有实质性的提高。
本文内容共有七章,用JavaScript语言完整地讨论了正则表达式的方方面面。
如果觉得文章某块儿没有说明白清楚,欢迎留言,能力范围之内,老姚必做详细解答。
构造正则表达式的方法和创建数学表达式的方法一样。也就是用多种元字符与运算符可以将小的表达式结合在一起来创建更大的表达式。正则表达式的组件可以是单个的字符、字符集合、字符范围、字符间的选择或者所有这些组件的任意组合。
正则表达式是由普通字符(例如字符 a 到 z)以及特殊字符(称为"元字符")组成的文字模式。模式描述在搜索文本时要匹配的一个或多个字符串。正则表达式作为一个模板,将某个字符模式与所搜索的字符串进行匹配。
/*
@param str the string to calc length
@param autotrim auto trim blank char. default : false
*/
function getAbsLength(str, autotrim) {
if (typeof str === 'undefined') return 0;
if (str == null) return 0;
// trim
var reg_trim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
var reg_chinese_char = /[\u4e00-\u9fa5]/;
autotrim = !!autotrim;
str = autotrim ? (str + "").replace(reg_trim, "") : (str + "");
var orig_len = str.length;
var absLen = 0;
for (var i = 0; i orig_len; i++) {
if (reg_chinese_char.test(str.charAt(i))) {
// chinese, length=2
absLen += 2;
} else {
absLen += 1;
}
}
return absLen;
}
除了中文,其它都算是一个字符的。。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流