正则表达式知识整理(JavaScript)

最新推荐文章于 2022-11-03 22:11:56 发布
最新推荐文章于 2022-11-03 22:11:56 发布
阅读量429 收藏
点赞数
分类专栏： html5+css3+js 文章标签： html5 css3 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/W_yichenyang/article/details/116983024
版权

正则表达式知识整理(JavaScript)

资料书：《JavaScript+jQuery交互式Web前端开发》黑马程序员编著

编程软件：Dreamweaver 

文中有错的地方请及时提醒，谢谢！

效果图：

代码分享：

html和js代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>正则表达式</title>
<link rel="stylesheet" href="regExp.css" type="text/css" />
</head>
	<p style="text-align: center;font-size: 16px;font-weight: bold;">正则表达式</p>
	<hr size="2px" color="blue" />
	<ul><li>认识正则表达式</li></ul>
	<p class="one1">
		<span class="one2">正则表达式的定义及特点：</span>
		定义：正则表达式(Regular Expression,RegExp)是一种描述字符串结构的语法规则，是用于匹配字符串中字符组合的模式，同时正则表达式也是对象。正则表达式通常被用来检索、替换那些符合某个模式(规则)的文本。此外，正则表达式还常用于过滤掉页面
		内容中的一些敏感词，或从字符串中获取想要的特定部分等。
		
		特点：正则表达式的灵活性、逻辑性和功能性非常强，可以迅速地用极简单的方式达到字符串的复杂控制。对于刚接触的人来说，正则表达式还是比较晦涩难懂的。在实际开发中，一般都是直接复制写好的正则表达式使用，但有些时候也需要根据实际情况
		编写或修改正则表达式。
		
		<span class="one2">正则表达式的使用：</span>在JavaScript中，使用正则表达式之前，需要创建正则对象。创建正则表达式的方式有两种，一种是用字面量方式创建，另一种是通过RegExp()构造函数的方式创建。
		
		字面量：var 变量名=/表达式/;构造函数：var 变量名=new RegExp(/表达式/)或者var 变量名=RegExp(/表达式)；其中，表达式是由元字符和文本字符组成的正则表达式模式文本。元字符是具有特殊含义的字符，如"^"、"."或"*"等；
		文本字符就是普通的文本，如字母和数字等。
		
		test()方法可以用来检测字符串是否符合正则规则，符合返回true，否则返回false，其参数是测试字符串。
		
		<span class="one2">模式修饰符：</span>正则表达式提供了模式修饰符可供开发者进行选择，语法：/表达式/[switch]，其中，switch表示模式修饰符，是可选的，用于进一步对正则表达式进行设置。其中，模式修饰符还可以多个组合在一起使用。
		<p style="text-align: center">模式修饰符</p>
		<table align="center">
			<tr bgcolor="#C0C0C0">
				<th>模式符</th>
				<th>说明</th>
			</tr>
			<tr>
				<td>g</td>
				<td>用于在目标字符串中实现全局匹配</td>
			</tr>
			<tr>
				<td>i</td>
				<td>忽略大小写</td>
			</tr>
			<tr>
				<td>m</td>
				<td>实现多行匹配</td>
			</tr>
			<tr>
				<td>u</td>
				<td>以Unicode编码执行正则表达式</td>
			</tr>
			<tr>
				<td>y</td>
				<td>黏性匹配，仅匹配目标字符串中此正则表示式的lastIndex属性指示的索引</td>
			</tr>
		</table>
	</p>
	<ul><li>正则表达式中的特殊字符：一个正则表达式可以由简单的字符构成，如/abc/，也可以是简单和特殊字符的组合，如/ab*c/。其中，特殊字符也被称为元字符，在正则表达式中是具有特殊意义的专用符号，如"^"、"$"、或"*"等。</li></ul>
	<p class="one1">
		<span class="one2">边界符和预定义类：</span>正则表达式中的边界符(位置符)用来提示字符所处的位置。当"^"和"$"同时出现时，表示精准匹配，必须匹配表达式中的字符串才符合规范。
		^：表示匹配行首的文本
		$：表示匹配行尾的文本
		
		预定义类：指的是某些常见模式的简写方式。JavaScript中给出的字符类别可以很容易地完成某些正则匹配。
		转义字符：在正则表达式中可以使用"\"转义特殊字符。此外，选择符"|"可以理解为"或"，经常用于查找的条件有多个时，只要其中一个条件满足即可成立的情况。由于在JavaScript中的字符串存在转义问题，因此代码中的"\\"表示反斜线"\"。
		<p style="text-align: center">预定义符</p>
		<table align="center">
			<tr bgcolor="#C0C0C0">
				<th>字符</th>
				<th>含义</th>
			</tr>
			<tr>
				<td>.</td>
				<td>匹配除"\n"外的任何单个字符</td>
			</tr>
			<tr>
				<td>\d</td>
				<td>匹配所有0~9之间的任意一个数字，相当于[0~9]</td>
			</tr>
			<tr>
				<td>\D</td>
				<td>匹配所有0~9以外的字符，相当于[^0~9]</td>
			</tr>
			<tr>
				<td>\w</td>
				<td>匹配任意的字母、数字和下划线，相当于[a-zA-Z0-9]</td>
			</tr>
			<tr>
				<td>\W</td>
				<td>除所有字母、数字和下划线以外的字符，相当于[^a-zA-Z0-9]</td>
			</tr>
			<tr>
				<td>\s</td>
				<td>匹配空格(包括换行符、制表符、空格符等)，相当于[\t\r\n\v\f]</td>
			</tr>
			<tr>
				<td>\S</td>
				<td>匹配非空格的字符，相当于[^\t\r\n\v\f]</td>
			</tr>
			<tr>
				<td>\f</td>
				<td>匹配一个换页符(form-feed)</td>
			</tr>
			<tr>
				<td>\b</td>
				<td>匹配单词分界符。如"\bg"可以匹配"best grade"，结果为"g"</td>
			</tr>
			<tr>
				<td>\B</td>
				<td>非单词分界符。如"\Bade"可以匹配"best grade"，结果为"abc"</td>
			</tr>
			<tr>
				<td>\t</td>
				<td>匹配一个水平制表符(tab)</td>
			</tr>
			<tr>
				<td>\n</td>
				<td>匹配一个换行符(linefeed)</td>
			</tr>
			<tr>
				<td>\xhh</td>
				<td>匹配ISO-8859-1值为hh(2个16进制数字)的字符，如"\x61"表示"a"</td>
			</tr>
			<tr>
				<td>\r</td>
				<td>匹配一个回车符(carriage return)</td>
			</tr>
			<tr>
				<td>\v</td>
				<td>匹配一个垂直制表符(vertical tab)</td>
			</tr>
			<tr>
				<td>\uhhhh</td>
				<td>匹配Unicode值为hhhh(4个16进制数字)的字符，如"\u597d"表示"好"</td>
			</tr>
		</table>
	</p>
	<p class="one1">
		<span class="one2">字符类和取反符</span>
		字符类：字符类是一个字符集，如果字符集中的任何一个字符有匹配，它就会找到该匹配项。正则表达式中的"[]"可以实现一个字符集合，只要求匹配其中的一项，所有可供选择的字符都放在方括号内。在开发中，如果允许用户输入英文字母(不区分大小写)、
		数字、连字符"-"、下划线"_"时，则可以使用var rg=/^[a-zA-Z0-9_-]$/；需要注意的是，连字符"-"在通话情况下指标是一个普通字符，只有在表示字符范围时才作为元字符来使用。
		
		取反符：当中括号中"[]"与元字符"^"一起使用时，称为取反符，表示匹配不在指定字符范围内的字符。
		<p style="text-align: center">字符范围示例</p>
		<table align="center">
			<tr bgcolor="#C0C0C0">
				<th>pattern(模式)</th>
				<th>说明</th>
			</tr>
			<tr>
				<td>[cat]</td>
				<td>匹配字符集合中的任意一个字符c、a、t</td>
			</tr>
			<tr>
				<td>[^cat]</td>
				<td>匹配除c、a、t以外的字符</td>
			</tr>
			<tr>
				<td>[A-Z]</td>
				<td>匹配字母A-Z范围内的字符</td>
			</tr>
			<tr>
				<td>[^a-z]</td>
				<td>匹配字母a-z范围外的字符</td>
			</tr>
			<tr>
				<td>[a-zA-Z0-9]</td>
				<td>匹配大小写字母和0-9范围内的字符</td>
			</tr>
			<tr>
				<td>[\u4e00-\u9fa5]</td>
				<td>匹配任意一个中文字符</td>
			</tr>
		</table>
	</p>
	<ul><li>量词符与括号字符</li></ul>
	<p class="one1">
		<span class="one2">量词符和括号字符</span>
		量词符：用来设定某个模式出现的次数，通过使用量词符(?、+、*、{})能够完成某个字符连续出现的匹配。
		
		括号字符：在正则表达式中，中括号"[]"表示字符集合，匹配中括号里的任意字符；大括号"{}"表示量词符，能够完成某个字符连续出现的匹配；小括号"()"表示优先级，被括起来的内容称为"子表达式"。小括号有多种作用，这里只介绍两种，
		1、改变限定符的范围，catch|er可匹配catch和er，而cat(ch|er)可匹配catch和cater。2、分组，当小括号后有量词符时，就表示对整个组进行操作。abc{2}可匹配abcc，a(bc){2}可匹配abcbc。
		<p style="text-align: center">量词符</p>
		<table align="center">
			<tr bgcolor="#C0C0C0">
				<th>字符</th>
				<th>说明</th>
				<th>示例</th>
				<th>结果</th>
			</tr>
			<tr>
				<td>?</td>
				<td>匹配?前面的字符零次或一次</td>
				<td>hi?t</td>
				<td>可匹配ht和hit</td>
			</tr>
			<tr>
				<td>+</td>
				<td>匹配+前面的字符一次或多次</td>
				<td>bre+ad</td>
				<td>可匹配范围从bread到bre...ad</td>
			</tr>
			<tr>
				<td>*</td>
				<td>匹配*前面的字符零次或多次</td>
				<td>ro*se</td>
				<td>可匹配范围从rse到ro..se</td>
			</tr>
			<tr>
				<td>{n}</td>
				<td>匹配{}前面的字符n次</td>
				<td>hit{2}er</td>
				<td>只能匹配到hitter</td>
			</tr>
			<tr>
				<td>{n.}</td>
				<td>匹配{}前面的字符最少n次</td>
				<td>hit{2,}er</td>
				<td>可匹配范围从hitter到hitt...er</td>
			</tr>
			<tr>
				<td>{n,m}</td>
				<td>匹配{}前面的字符最少n次，最多m次</td>
				<td>fe{0,2}l</td>
				<td>可匹配fl、fel和feel三种情况</td>
			</tr>
		</table>
	</p>
	<p class="one1">
		<span class="one2">正则表达式优先级：</span>正则表达式中的特殊符号有很多，在实际应用时，各种特殊符号会遵循优先级顺序进行匹配。
		<p style="text-align: center">正则表达式优先级</p>
		<table align="center">
			<tr bgcolor="#C0C0C0">
				<th>符号</th>
				<th>说明</th>
			</tr>
			<tr>
				<td>\</td>
				<td>转义符</td>
			</tr>
			<tr>
				<td>()、(?:)、(?=)、[]</td>
				<td>圆括号和中括号</td>
			</tr>
			<tr>
				<td>*、+、?、{n}、{n,}、{n,m}</td>
				<td>限定符</td>
			</tr>
			<tr>
				<td>^、$、\任何元字符、任何字符</td>
				<td>定位点和序列</td>
			</tr>
			<tr>
				<td>|</td>
				<td>"或"操作</td>
			</tr>
		</table>
	</p>
	<ul><li>String类中的方法：在处理程序或者网页时，经常需要根据正则匹配模式完成对指定字符串的搜索、匹配和替换。String类中的match()、search()、split()方法都可以使用正则表达式进行字符串处理。</li></ul>
	<p class="one1">
		<span class="one2">match(RegExp)方法：</span>String类中的match()方法除了可在字符串内检索指定的值外，还可以在目标字符串中根据正则匹配出所有符合要求的内容，匹配成功后将其保存到数组中，失败返回false。
		
		<span class="one2">search(RegExp)方法：</span>可以返回指定模式的子串在字符串首次出现的位置，相对于indexOf()方法来说功能更强大。search()方法匹配失败后的返回值为-1。
		
		<span class="one2">split(RegExp[,分割次数])方法：</span>用于根据指定的分隔符将一个字符串分割成字符串数组，其分割后的字符串数组中不包括分隔符。分割符不只一个时，需要定义正则对象才能够完成字符串的分割操作。返回值是以数组形式保存的分割后的结果。当字符串
		为空时，split()方法返回的是一个包含一个空字符串的数组"[""]"，如果字符串和分隔符都是空字符串，则返回一个空数组"[]"。当指定字符串分割次数后，若指定的次数小于实际字符串中符合规则分割的次数，则最后的返回结果中会忽略其他的分割结果。
		
		<span class="one2">replace(RegExp[,参数2])方法：</span>用于替换字符串，参数2表示替换的部分。方法的返回值是替换后的新字符串，并不会修改原字符串的内容。
		
	</p>
	<hr size="2px" color="blue" />
	<p style="text-align: center;font-size: 16px;font-weight: bold;">未完待续...</p>
<body>
</body>
</html>

css代码：

@charset "utf-8";
/* CSS Document */

.one1 {
	white-space: pre;
	margin-top:-20px;
	margin-bottom:-20px;
}

.one2 {
	color: red;
	font-style: italic;
	font-weight: bold;
}

table{
	border: 1px solid #6B3435;
	border-collapse: collapse;
}
th,td{border: 1px solid #6B3435;white-space: pre;}

.beforeImg:before {
	content: url("arrow.jpg");
}

.beforeImg {
	text-indent: 8em;
	white-space: pre;
}

未完待续，敬请期待...

河里的草
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
js的高级笔记4:正则表达式、字符类、预定义类、正则替换replace
小黄呀呀呀的博客
10-10 352
1.正则表达式概述 1.1什么是正则表达式 正则表达式（ Regular Expression ）是用于匹配字符串中字符组合的模式。在JavaScript中，正则表达式也是对象。 正则表通常被用来检索、替换那些符合某个模式（规则）的文本，例如验证表单：用户名表单只能输入英文字母、数字或者下划线， 昵称输入框中可以输入中文(匹配)。此外，正则表达式还常用于过滤掉页面内容中的一些敏感词(替换)，或从字符串中获取我们想要的特定部分(提取)等 。 其他语言也会使用正则表达式，本阶段我们主要是利用JavaScript
JavaScript-正则表达式
Sco_jing的博客
07-20 195
文章目录概述在JavaScript中的使用创建正则表达式测试正则表达式 test特殊字符正则表达式的组成模块修饰符边界符字符类量词符【案例】用户名验证括号总结预定义类替换 概述 正则表达式（ Regular Expression ）是描述字符串规则的表达式。用于匹配字符串中字符组合的模式。在 JavaScript中，正则表达式也是对象。 正则表通常被用来检索、替换那些符合某个模式（规则）的文本，例如验证表单：用户名表单只能输入英文字母、数字或者下划线， 昵称输入框中可以输入中文(匹配)。此外，正则表达式
JavaScript —— 正则表达式元字符
dieeming9110的博客
09-27 470
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>正则表达式</title> <scri...
php正则ul,基于正则表达式实现UL下LI的样式替换功能
weixin_36420854的博客
03-21 97
本文实例讲述了基于正则表达式实现UL下LI的样式替换功能。分享给大家供大家参考，具体如下：最先我想到是在UL下填充好在替换发觉结果差强人意，没有真正改变样式：$("#UlContent li").each(function (index) {// alert(index + ': ' + $(this).text());var text = $(this).text();var regExp = ...
JavaScript正则表达式
星河梦~的博客
07-25 413
目录认识正则表达式概念正则表达式的创建正则表达式的测试正则表达式中的修饰符String类中的方法练习 认识正则表达式 概念 （1）正则表达式：是描述字符串规则的表达式，用于匹配字符组合的规则，是一个对象 （2）特点 非常灵活 逻辑性强 可以用简单的方式对字符串进行复杂的控制 正则表达式的创建 （1）字面量方式： var 变量名=/表达式/ （2）RegExp构造函数方式： var 变量名=new RegExp(表达式) 正则表达式的测试 JavaScript中，我们使用test()进行测试。 例如：
JavaScript正则表达式(总结篇）
01-19
本文是小编参考其他有关js正则表达式资料整理的，主要目的有两个：一：自我复习归纳总结。二：共享方便大家搜索 。js正则表达式感兴趣的朋友可以一起学习，没有写的知识点，欢迎大家补充，共同学习进步. 验证数字：^...
javascript正则表达式容易被忽略的小问题整理.docx
01-13
JavaScript中的正则表达式是编程语言中非常强大的文本处理工具，但同时也存在一些容易被开发者忽视的小问题。这里我们将深入探讨其中的一些关键点。 1. **`lastIndex`属性的特异性** `lastIndex`属性是正则表达式...
JavaScript验证知识整理
12-08
JS只能输入数字，数字和字母等的正则表达式 1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"&...
前端十年经验 - JavaScript基础知识大纲-思维构图.pdf
04-18
该大纲采用思维构图的方式，将JavaScript的基础知识按照不同的主题进行分类和整理，包括数据类型、运算符、流程控制、函数、对象、数组、正则表达式、DOM操作、事件处理等方面。 通过这份大纲，前端开发者可以全面...
fe-tutorial::spiral_notepad: 前端学习笔记，整理了 JavaScript 知识、数据结构和算法、webpack 基础知识等
08-03
JavaScript 知识整理 高阶函数 函数柯里化 EventEmitter 实现异步打印 数组去重，扁平化和最值 数组乱序 懒加载 无限滚动 RegExp 正则表达式 RegExp 构造函数属性 应用 浏览器工作原理 浏览器的多进程和JS单线程 ...
高速 Fel表达式引擎
04-23
高速 Fel表达式引擎 。类似ognl 速度很快。 性能很高
正则表达式
Mr_115的博客
11-03 204
正则表达式
4.正则表达式入门之限定符
c1776167012的博客
12-17 134
1.限定符 2.实例学习 1）{n} n 是一个非负整数。匹配确定的 n 次。 例子： public static void main(String[] args) { String str="liife is a fuck _movie"; //获得一个正则表达式对象 Pattern p = Pattern.compile("li{2}fe.*"); //使用正则表达式对象处理指定字符串,并获得结果对象 Matcher m = p.matcher(str);
正则表达式入门
qq_38431321的博客
06-24 1485
快速入门正则表达式
js正则表达式匹配span标签
solocao的专栏
03-25 3832
1、js正则表达式匹配span标签 const spans = htmlStr.match(/<span (.*?)>(.*?)<\/span>/g) 2、js正则表达式–获取标签内的文本 先抓取 >文本</，再抓取 文本 function fn(str){ var patt1=/\>.[\u2E80-\u9FFF]*\<\//g; var arr=str.match(patt1); var patt2=/[\u4e00-\u9fa5]/g; var
正则匹配所有#{}类型入参是否符合自定义枚举类型
m0_55409543的博客
09-17 981
1.场景:用户可以自定义模板，但是部分模板内容必须按照我指定的枚举值 自定义的枚举类，跟前端交互时规定使用#{枚举值}的写法。 2.首先写一个匹配所有#{}的正则 java.util.regex.Pattern p = java.util.regex.Pattern.compile("\\#\\{[a-zA-Z_].*?\\}"); java.util.regex.Matcher m = p.matcher(str); while (m.find()){ .
正则表达式循环匹配
qq_36963007的博客
03-11 1261
let str=` <ul> <li> <a>肖申克的救赎</a> <p>上映日期：1994-09-10</p> </li> <li> <a>阿甘正传</a> <p>上映日期：1994-07-06</p> </li> </ul>`; con
常用的正则表达式匹配规则
热门推荐
weiyang_tang的博客
09-21 1万+
常用的正则表达式匹配规则 模式 描述 \w 匹配字母、数字、下划线,等价于[a-zA-Z0-9_] \w可以匹配汉字(python), \W 匹配不是字母、数字、下划线的其他字符 \s 匹配任意空白字符,等价于(\t\n\r\f) \S 匹配任意非空字符 \d 匹配数字,等价于[0-9] \D 匹配不是数字的字符 \A 匹配字符串开头 \Z 匹配字符串结...
javascript 正则表达式 转换 java 正则表达式_Javascript Regex到Java正则表达式
最新发布
05-14
将 JavaScript 的正则表达式转换为 Java 的正则表达式，需要注意以下几点： 1. JavaScript 和 Java 的正则表达式语法略有不同，需要根据具体情况进行调整。 2. JavaScript 的正则表达式使用斜杠（/）作为分隔符，...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值