Home > Web Front-end > JS Tutorial > Commonly used basic syntax of JavaScript regular expressions

Commonly used basic syntax of JavaScript regular expressions

韦小宝
Release: 2018-01-29 10:28:35
Original
1835 people have browsed it

This article will explain to you Regular expressionsCommonly used basic syntax. Learning the common basic syntax of regular expressions is the basis for learning programming. Regular expressions are widely used in programs. When we are doing Regular expressions are most obviously used during verification. This article will take you to learn about the common basic syntax of regular expressions

1.Regular Expressions Basic syntax

Two special symbols '^' and '$'. Their function is to indicate the beginning and end of a string respectively.

Examples are as follows:

"^The": represents all strings starting with "The" ("There", "The cat", etc.);

"of despair$": indicates a string ending with "of despair";

"^abc$": indicates a string starting and ending with "abc" - haha, there is only "abc" itself. ;

"notice": Represents any string containing "notice".

Like the last example, if you don't use the two special characters , you are indicating that the string you want to find is in any part of the searched string - you are not
It's positioned at the top of something.

Other symbols include '*', '+' and '?', which represent the number of times a character or a sequence of characters appears repeatedly.

They mean "none or more", "once or more" and "none or once" respectively.

Here are a few examples:

"ab*": Indicates that a string has an a followed by zero or several b. ("a", "ab", "abbb",...);

"ab+": Indicates that a string has an a followed by at least one b or more;

" ab?": Indicates that a string has an a followed by zero or one b;

"a?b+$": Indicates that there is zero or one a followed by one or several b at the end of the string .

You can also use a range, enclosed in curly brackets, to indicate the range of repetitions.

"ab{2}": Indicates that a string has an a followed by 2 b ("abb");

"ab{2,}": Indicates that a string has a a followed by at least 2 b;

"ab{3,5}": Indicates that a string has an a followed by 3 to 5 b.

Please note that you must specify the lower limit of the range (eg: "{0,2}" instead of "{,2}").

Also, you may have noticed that '*', '+' and '?' are equivalent to "{0,}", "{1,}" and "{0,1}".

There is also a '¦', which means "or" operation:

"hi¦hello": indicates that there is "hi" or "hello" in a string;

"(b¦cd)ef": represents "bef" or "cdef";

"(a¦b)*c": represents a string of mixed "a" and "b" followed by A "c";

'.' can replace any character:

"a.[0-9]": Indicates that a string has an "a" followed by an arbitrary character and A number;

"^.{3}$": indicates a string of any three characters (length is 3 characters);

The square brackets indicate that certain characters are allowed in a Appears at a specific position in the string:

"[ab]": indicates that a string has an "a" or "b" (equivalent to "a¦b");

"[a-d]": Indicates that a string contains one of lowercase 'a' to 'd' (equivalent to "a¦b¦c¦d" or "[abcd]");

"^[a-zA-Z]": represents a string starting with a letter;

"[0-9]%": represents a number preceded by a percent sign;

",[a-zA-Z0-9]$": Indicates that a string ends with a comma followed by a letter or number.

You can also use '^' in square brackets to indicate unwanted characters. '^' should be the first one in the square brackets.

(For example: "%[^a-zA-Z]%" means that letters should not appear between two percent signs).

In order to express verbatim, you must add the transfer character '\' before the characters "^.$()¦*+?{\".

Please note that within square brackets, no escape characters are required.

2. Regular expression validation control text box input Character type

1. Only Enter numbers and English:

<input onkeyup="value=value.replace(/[\W]/g,&#39;&#39;) " onbeforepaste="clipboardData.setData(&#39;text&#39;,clipboardData.getData(&#39;text&#39;).replace(/[^\d]/g,&#39;&#39;))" ID="Text1" NAME="Text1">
Copy after login

2. Enter numbers only:

<input onkeyup="value=value.replace(/[^\d]/g,&#39;&#39;) " onbeforepaste="clipboardData.setData(&#39;text&#39;,clipboardData.getData(&#39;text&#39;).replace(/[^\d]/g,&#39;&#39;))" ID="Text2" NAME="Text2">
Copy after login

3. Enter full-width only:

<input onkeyup="value=value.replace(/[^\uFF00-\uFFFF]/g,&#39;&#39;)" onbeforepaste="clipboardData.setData(&#39;text&#39;,clipboardData.getData(&#39;text&#39;).replace(/[^\uFF00-\uFFFF]/g,&#39;&#39;))" ID="Text3" NAME="Text3">
Copy after login

4. Only Chinese characters can be input:

<input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,&#39;&#39;)" onbeforepaste="clipboardData.setData(&#39;text&#39;,clipboardData.getData(&#39;text&#39;).replace(/[^\u4E00-\u9FA5]/g,&#39;&#39;))" ID="Text4" NAME="Text4">
Copy after login

3. Popular explanation of application examples of regular expressions

******************************************* ************************************

//Verify whether it is all numbers Composition

/^[0-9]{1,20}$/

^ 表示打头的字符要匹配紧跟^后面的规则

$ 表示打头的字符要匹配紧靠$前面的规则

[ ] 中的内容是可选字符集

[0-9] 表示要求字符范围在0-9之间

{1,20}表示数字字符串长度合法为1到20,即为[0-9]中的字符出现次数的范围是1到20次。

/^ 和 $/成对使用应该是表示要求整个字符串完全匹配定义的规则,而不是只匹配字符串中的一个子串。

*******************************************************************************

//校验登录名:只能输入5-20个以字母开头、可带数字、“_”、“.”的字串

/^[a-zA-Z]{1}([a-zA-Z0-9]|[._]){4,19}$/

^[a-zA-Z]{1} 表示第一个字符要求是字母。

([a-zA-Z0-9]|[._]){4,19} 表示从第二位开始(因为它紧跟在上个表达式后面)的一个长度为4到9位的字符串,它要求是由大小写字母、数字或者特殊字符集[._]组成。

*******************************************************************************

//校验用户姓名:只能输入1-30个以字母开头的字串

/^[a-zA-Z]{1,30}$/

*******************************************************************************

//校验密码:只能输入6-20个字母、数字、下划线

/^(\w){6,20}$/

\w:用于匹配字母,数字或下划线字符

*******************************************************************************

//校验普通电话、传真号码:可以“+”或数字开头,可含有“-” 和 “ ”

/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/

\d:用于匹配从0到9的数字;

“?”元字符规定其前导对象必须在目标对象中连续出现零次或一次

可以匹配的字符串如:+123 -999 999 ; +123-999 999 ;123 999 999 ;+123 999999等

*******************************************************************************
//校验URL

/^http[s]{0,1}:\/\/.+$/ 或 /^http[s]{0,1}:\/\/.{1,n}$/ (表示url串的长度为length(“https://”) + n )
\ / :表示字符“/”。

. 表示所有字符的集

+ 等同于{1,},就是1到正无穷吧。

*******************************************************************************

//校验纯中文字符
/

^[\u4E00-\u9FA5]+$/

[\u4E00-\u9FA5] :估计是中文字符集的范围吧

以上表达式均在下面的javascript中测试通过

<html>
<script language="JavaScript">
<!--
function regx(r,s)
{
    if (r == null || r == ""){
       return false;
    }
    var patrn= new RegExp(r);
    if (patrn.exec(s))
       return true
    return false
}
-->
</script>
<body>
<form>
Copy after login

规则表达式 :

 <input type="input" name="regxStr" value="" > (填写/ /之间的表达式)
<br>
Copy after login

校验字符串 :

 <input type="input" name="str" value="" >
    <input type="button" name="match" value="匹配" onClick="alert(regx(regxStr.value,str.value));">
</form>
</body>
</html>
Copy after login

4.正則表達式應用

"^\d+$"  //非负整数(正整数 + 0)

"^[0-9]*[1-9][0-9]*$"  //正整数

"^((-\d+)|(0+))$"  //非正整数(负整数 + 0)

"^-[0-9]*[1-9][0-9]*$"  //负整数

"^-?\d+$"    //整数

"^\d+(\.\d+)?$"  //非负浮点数(正浮点数 + 0)

"^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$"  //正浮点数

"^((-\d+(\.\d+)?)|(0+(\.0+)?))$"  //非正浮点数(负浮点数 + 0)

"^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"  //负浮点数

"^(-?\d+)(\.\d+)?$"  //浮点数

"^[A-Za-z]+$"  //由26个英文字母组成的字符串

"^[A-Z]+$"  //由26个英文字母的大写组成的字符串

"^[a-z]+$"  //由26个英文字母的小写组成的字符串

"^[A-Za-z0-9]+$"  //由数字和26个英文字母组成的字符串

"^\w+$"  //由数字、26个英文字母或者下划线组成的字符串

"^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$"    //email地址

"^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$"  //url

/^(d{2}|d{4})-((0([1-9]{1}))|(1[1|2]))-(([0-2]([1-9]{1}))|(3[0|1]))$/ // 年-月-日

/^((0([1-9]{1}))|(1[1|2]))/(([0-2]([1-9]{1}))|(3[0|1]))/(d{2}|d{4})$/ // 月/日/年

"^([w-.]+)@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.)|(([w-]+.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(]?)$" //Emil

"(d+-)?(d{4}-?d{7}|d{3}-?d{8}|^d{7,8})(-d+)?" //电话号码

"^(d{1,2}|1dd|2[0-4]d|25[0-5]).(d{1,2}|1dd|2[0-4]d|25[0-5]).(d{1,2}|1dd|2[0-4]d|25[0-5]).(d{1,2}|1dd|2[0-4]d|25[0-5])$" //IP地址

^([0-9A-F]{2})(-[0-9A-F]{2}){5}$ //MAC地址的正则表达式

^[-+]?\d+(\.\d+)?$ //值类型正则表达式

5.javascript正则表达式检验

//校验是否全由数字组成

function isDigit(s)
{
var patrn=/^[0-9]{1,20}$/;
if (!patrn.exec(s)) return false
return true
}
Copy after login

//校验登录名:只能输入5-20个以字母开头、可带数字、“_”、“.”的字串

function isRegisterUserName(s)
{
var patrn=/^[a-zA-Z]{1}([a-zA-Z0-9]|[._]){4,19}$/;
if (!patrn.exec(s)) return false
return true
}
Copy after login

//校验用户姓名:只能输入1-30个以字母开头的字串

function isTrueName(s)
{
var patrn=/^[a-zA-Z]{1,30}$/;
if (!patrn.exec(s)) return false
return true
}
Copy after login

//校验密码:只能输入6-20个字母、数字、下划线

function isPasswd(s)
{
var patrn=/^(\w){6,20}$/;
if (!patrn.exec(s)) return false
return true
}
Copy after login

//校验普通电话、传真号码:可以“+”开头,除数字外,可含有“-”

function isTel(s)
{
//var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?(\d){1,12})+$/;
var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/;
if (!patrn.exec(s)) return false
return true
}
Copy after login

//校验手机号码:必须以数字开头,除数字外,可含有“-”

function isMobil(s)
{
var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/;
if (!patrn.exec(s)) return false
return true
}
Copy after login

//校验邮政编码

function isPostalCode(s)
{
//var patrn=/^[a-zA-Z0-9]{3,12}$/;
var patrn=/^[a-zA-Z0-9 ]{3,12}$/;
if (!patrn.exec(s)) return false
return true
}
Copy after login

//校验搜索关键字

function isSearch(s)
{
var patrn=/^[^`~!@#$%^&*()+=|\\\][\]\{\}:;\&#39;\,.<>/?]{1}[^`~!@$%^&()+=|\\\][\]\{\}:;\&#39;\,.<>?]{0,19}$/;
if (!patrn.exec(s)) return false
return true
}
function isIP(s) //by zergling
{
var patrn=/^[0-9.]{1,20}$/;
if (!patrn.exec(s)) return false
return true
}
 
/*********************************************************************************
* FUNCTION: isBetween
* PARAMETERS: val AS any value
* lo AS Lower limit to check
* hi AS Higher limit to check
* CALLS: NOTHING
* RETURNS: TRUE if val is between lo and hi both inclusive, otherwise false.
**********************************************************************************/
function isBetween (val, lo, hi) {
if ((val < lo) || (val > hi)) { return(false); }
else { return(true); }
}
/*********************************************************************************
* FUNCTION: isDate checks a valid date
* PARAMETERS: theStr AS String
* CALLS: isBetween, isInt
* RETURNS: TRUE if theStr is a valid date otherwise false.
**********************************************************************************/
function isDate (theStr) {
var the1st = theStr.indexOf(&#39;-&#39;);
var the2nd = theStr.lastIndexOf(&#39;-&#39;);
if (the1st == the2nd) { return(false); }
else {
var y = theStr.substring(0,the1st);
var m = theStr.substring(the1st+1,the2nd);
var d = theStr.substring(the2nd+1,theStr.length);
var maxDays = 31;
if (isInt(m)==false || isInt(d)==false || isInt(y)==false) {
return(false); }
else if (y.length < 4) { return(false); }
else if (!isBetween (m, 1, 12)) { return(false); }
else if (m==4 || m==6 || m==9 || m==11) maxDays = 30;
else if (m==2) {
if (y % 4 > 0) maxDays = 28;
else if (y % 100 == 0 && y % 400 > 0) maxDays = 28;
else maxDays = 29;
}
if (isBetween(d, 1, maxDays) == false) { return(false); }
else { return(true); }
}
}
/*********************************************************************************
* FUNCTION: isEuDate checks a valid date in British format
* PARAMETERS: theStr AS String
* CALLS: isBetween, isInt
* RETURNS: TRUE if theStr is a valid date otherwise false.
**********************************************************************************/
function isEuDate (theStr) {
if (isBetween(theStr.length, 8, 10) == false) { return(false); }
else {
var the1st = theStr.indexOf(&#39;/&#39;);
var the2nd = theStr.lastIndexOf(&#39;/&#39;);
if (the1st == the2nd) { return(false); }
else {
var m = theStr.substring(the1st+1,the2nd);
var d = theStr.substring(0,the1st);
var y = theStr.substring(the2nd+1,theStr.length);
var maxDays = 31;
if (isInt(m)==false || isInt(d)==false || isInt(y)==false) {
return(false); }
else if (y.length < 4) { return(false); }
else if (isBetween (m, 1, 12) == false) { return(false); }
else if (m==4 || m==6 || m==9 || m==11) maxDays = 30;
else if (m==2) {
if (y % 4 > 0) maxDays = 28;
else if (y % 100 == 0 && y % 400 > 0) maxDays = 28;
else maxDays = 29;
}
if (isBetween(d, 1, maxDays) == false) { return(false); }
else { return(true); }
}
}
}
/********************************************************************************
* FUNCTION: Compare Date! Which is the latest!
* PARAMETERS: lessDate,moreDate AS String
* CALLS: isDate,isBetween
* RETURNS: TRUE if lessDate<moreDate
*********************************************************************************/
function isComdate (lessDate , moreDate)
{
if (!isDate(lessDate)) { return(false);}
if (!isDate(moreDate)) { return(false);}
var less1st = lessDate.indexOf(&#39;-&#39;);
var less2nd = lessDate.lastIndexOf(&#39;-&#39;);
var more1st = moreDate.indexOf(&#39;-&#39;);
var more2nd = moreDate.lastIndexOf(&#39;-&#39;);
var lessy = lessDate.substring(0,less1st);
var lessm = lessDate.substring(less1st+1,less2nd);
var lessd = lessDate.substring(less2nd+1,lessDate.length);
var morey = moreDate.substring(0,more1st);
var morem = moreDate.substring(more1st+1,more2nd);
var mored = moreDate.substring(more2nd+1,moreDate.length);
var Date1 = new Date(lessy,lessm,lessd); 
var Date2 = new Date(morey,morem,mored); 
if (Date1>Date2) { return(false);}
return(true);
}
/*********************************************************************************
* FUNCTION isEmpty checks if the parameter is empty or null
* PARAMETER str AS String
**********************************************************************************/
function isEmpty (str) {
if ((str==null)||(str.length==0)) return true;
else return(false);
}
/*********************************************************************************
* FUNCTION: isInt
* PARAMETER: theStr AS String 
* RETURNS: TRUE if the passed parameter is an integer, otherwise FALSE
* CALLS: isDigit
**********************************************************************************/
function isInt (theStr) {
var flag = true;
if (isEmpty(theStr)) { flag=false; }
else
{ for (var i=0; i<theStr.length; i++) {
if (isDigit(theStr.substring(i,i+1)) == false) {
flag = false; break;
}
}
}
return(flag);
}
/*********************************************************************************
* FUNCTION: isReal
* PARAMETER: heStr AS String 
decLen AS Integer (how many digits after period)
* RETURNS: TRUE if theStr is a float, otherwise FALSE
* CALLS: isInt
**********************************************************************************/
function isReal (theStr, decLen) {
var dot1st = theStr.indexOf(&#39;.&#39;);
var dot2nd = theStr.lastIndexOf(&#39;.&#39;);
var OK = true;
if (isEmpty(theStr)) return false;
if (dot1st == -1) {
if (!isInt(theStr)) return(false);
else return(true);
}
else if (dot1st != dot2nd) return (false);
else if (dot1st==0) return (false);
else {
var intPart = theStr.substring(0, dot1st);
var decPart = theStr.substring(dot2nd+1);
if (decPart.length > decLen) return(false);
else if (!isInt(intPart) || !isInt(decPart)) return (false);
else if (isEmpty(decPart)) return (false);
else return(true);
}
}
/*********************************************************************************
* FUNCTION: isEmail
* PARAMETER: String (Email Address)
* RETURNS: TRUE if the String is a valid Email address
* FALSE if the passed string is not a valid Email Address
* EMAIL FORMAT: AnyName@EmailServer e.g; webmaster@hotmail.com
* @ sign can appear only once in the email address.
*********************************************************************************/
function isEmail (theStr) {
var atIndex = theStr.indexOf(&#39;@&#39;);
var dotIndex = theStr.indexOf(&#39;.&#39;, atIndex);
var flag = true;
theSub = theStr.substring(0, dotIndex+1)
if ((atIndex < 1)||(atIndex != theStr.lastIndexOf(&#39;@&#39;))||(dotIndex < atIndex + 2)||(theStr.length <= theSub.length)) 
{ return(false); }
else { return(true); }
}
/*********************************************************************************
* FUNCTION: newWindow
* PARAMETERS: doc -> Document to open in the new window
hite -> Height of the new window
wide -> Width of the new window
bars -> 1-Scroll bars = YES 0-Scroll Bars = NO
resize -> 1-Resizable = YES 0-Resizable = NO
* CALLS: NONE
* RETURNS: New window instance
**********************************************************************************/
function newWindow (doc, hite, wide, bars, resize) {
var winNew="_blank";
var opt="toolbar=0,location=0,directories=0,status=0,menubar=0,";
opt+=("scrollbars="+bars+",");
opt+=("resizable="+resize+",");
opt+=("width="+wide+",");
opt+=("height="+hite);
winHandle=window.open(doc,winNew,opt);
return;
}
/*********************************************************************************
* FUNCTION: DecimalFormat
* PARAMETERS: paramValue -> Field value
* CALLS: NONE
* RETURNS: Formated string
**********************************************************************************/
function DecimalFormat (paramValue) {
var intPart = parseInt(paramValue);
var decPart =parseFloat(paramValue) - intPart;
str = "";
if ((decPart == 0) || (decPart == null)) str += (intPart + ".00");
else str += (intPart + decPart);
return (str);
}
Copy after login

 "^\\d+$"  //非负整数(正整数 + 0)

"^[0-9]*[1-9][0-9]*$"  //正整数

"^((-\\d+)|(0+))$"  //非正整数(负整数 + 0)

"^-[0-9]*[1-9][0-9]*$"  //负整数

"^-?\\d+$"    //整数

"^\\d+(\\.\\d+)?$"  //非负浮点数(正浮点数 + 0)

"^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$"  //正浮点数

"^((-\\d+(\\.\\d+)?)|(0+(\\.0+)?))$"  //非正浮点数(负浮点数 + 0)

"^(-(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"  //负浮点数

"^(-?\\d+)(\\.\\d+)?$"  //浮点数

"^[A-Za-z]+$"  //由26个英文字母组成的字符串

"^[A-Z]+$"  //由26个英文字母的大写组成的字符串

"^[a-z]+$"  //由26个英文字母的小写组成的字符串

"^[A-Za-z0-9]+$"  //由数字和26个英文字母组成的字符串

"^\\w+$"  //由数字、26个英文字母或者下划线组成的字符串

"^[\\w-]+(\\.[\\w-]+)*@[\\w-]+(\\.[\\w-]+)+$"    //email地址

"^[a-zA-z]+://(\\w+(-\\w+)*)(\\.(\\w+(-\\w+)*))*(\\?\\S*)?$"  //url

以上就是给大家分享的正则表达式基本语法,详细的阅读完之后你是不是发现正则表达式并没有一开始想象的那么难,还是蛮简单的。

加深印象:

JavaScript正则表达式的应用

学习JavaScript正则表达式的应用与使用

JavaScript正则方法replace实现搜索关键字高亮显示

实现搜索关键字高亮的功能.先介绍一下正则表达式的replace方法

看视频学习正则:

JavaScript正则表达式视频教程

很多人对正则表达式的印象是很强大、很难学、记不住。本次课程可信目标就是让大家不是记住正则表达式,而是理解正则表达式,借助图形化工具让大家直观的感受正则表达式,用起来得心应手,挥洒自如。你懂了正则表达式真的很简单!

The above is the detailed content of Commonly used basic syntax of JavaScript regular expressions. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template