javascript 正则表达式小案例

写一个简单的正则表达式应用

原有字符串：

var a = "string = 'abc'",b = "number = '123'"

想通过正则表达式替换成：

var a="",b=""

接下来看我操作的过程

//var a = "string = 'abc'",b = "number = '123'"
var str = "var a = \"string = \'abc\'\",b = \"number = \'123\'\"";
var reg = /['"][\w]+['"]/g;
document.write(str.replace(reg,'""'));

输入结果：

var a = "string = """,b = "number = """

这时发现只把abc和123替换掉成了双引号，为什么呢

主要是\w的使用：

\w 匹配包括下划线的任何单词字符。等价于 '[A-Za-z0-9_]'。

因为在"string = "中包含=及空格，所以不能匹配

接下来我做了个调整：

//var a = "string = 'abc'",b = "number = '123'"
var str = "var a = \"string = \'abc\'\",b = \"number = \'123\'\"";
var reg = /['"][\w\W]+['"]/g;
document.write(str.replace(reg,'""'));

这时输出结果：

var a = ""

这个是因为正则默认是贪婪匹配，它会匹配最多值，所以直接把string = 'abc'",b = "number = '123'都匹配到了。

接下来禁止它的贪婪匹配，

? 当该字符紧跟在任何一个其他限制符 (*, +, ?, {n}, {n,}, {n,m}) 后面时，匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串，而默认的贪婪模式则尽可能多的匹配所搜索的字符串。例如，对于字符串 "oooo"，'o+?' 将匹配单个 "o"，而 'o+' 将匹配所有 'o'。

按下来做的调整：

var str = "var a = \"string = \'abc\'\",b = \"number = \'123\'\"";
var reg = /['"][\w\W]+?['"]/g;
document.write(str.replace(reg,'""'));

输出结果：

var a = ""abc""number = """

这时的匹配结果还是有问题

它把“"string = '”做成了一组进行了匹配，也就是当正则搜索到一个引号时无论是单引号还是双引号都默认成一组，这个是由['"]决定的。应该是做到如果开始匹配的是单引号，那结束也要匹配成单引号。这个如何实现呢？

\num 匹配 num，其中 num 是一个正整数。对所获取的匹配的引用。例如，'(.)\1' 匹配两个连续的相同字符。

接着继续做出修改：

var str = "var a = \"string = \'abc\'\",b = \"number = \'123\'\"";
var reg = /(['"])[\w\W]+?\1/g;
document.write(str.replace(reg,'""'));

结果输出：

var a = "",b = ""

OK,结果正是要实现的效果。

转载于:https://www.cnblogs.com/guopei/archive/2011/05/04/2036649.html

javascript 正则表达式小案例相关推荐

Javascript函数小案例--《找质数》
什么是质数除了1和其本身外,没有能被其整除的数. 我们知道: 1.十以内的质数有: 2, 3, 5, 7. 1 既不是质数也不是合数, 所以, 先把1划掉. 2. 再划掉除2以外, 所有2的倍数. ...
JavaScript 各种小案例
1.题目----判断时间阶段用户输入几点弹出问候信息: 用户输入12点中午用户输入18点晚上用户输入23点深夜建议:通过比较运算符弹出对应值 <script>var time ...
《JavaScript 正则表达式迷你书》知识点小抄本
介绍这周开始学习老姚大佬的<JavaScript 正则表达式迷你书> , 然后习惯性的看完一遍后,整理一下知识点,便于以后自己重新复习. 我个人觉得:自己整理下来的资料,对于知识重现,效 ...
JavaScript基础语法及小案例
目录 JavaScript基础语法 1. 变量声明和赋值 2. 数据类型 1) 基本数据类型 2) 复合数据类型(引用类型) 3) 特殊数据类型 3. 运算符 1) 算术运算符 2) 赋值运算符 3) ...
javascript正则表达式大括号、中括号、小括号的作用以及应用场景
在JavaScript正则表达式中,大括号 {}.中括号 [] 和小括号 () 都有不同的作用和应用场景. 大括号 {} 在正则表达式中,大括号 {} 表示重复次数.以下是一些常见的应用场景: {n} ...
HTML+CSS+JavaScript小案例（注册页面表单验证轮播图跳转主页动态表格select联动）
案例:(表单验证) <!DOCTYPE html> <html lang="en"> <head><meta charset=" ...
Javascript小案例（一）：仿淘宝搜索框用户输入事件的实现
淘宝是我们经常用的一个网上购物平台,打开淘宝网首页,找到淘宝首页的搜索框,如下如所示: (截图日期:2017年6月18日) 大家可以看到,当页面一打开,搜索框中就可以看到灰色字体"少女高跟鞋 ...
JavaScript 国庆倒计时小案例
本次实现js国庆倒计时小案例开发工具与关键技术:Visual Studio 2015 JavaScript 当然首先还是先写出大概样式如下图: 之后便是我的css样式了: 下图便是在页面加载完成的 ...
javaScript小案例------js实现手风琴效果篇
原生js书写手风琴效果 js手风琴效果第一种方法手风琴需求 html和css: html: css: js animate.js index.js 第二种方法 js手风琴效果我用了两种方法来完成 ...
JavaScript正则表达式的学习
JavaScript正则表达式的学习 1. 正则表达式概述 1.1 什么是正则表达式正则表达式( Regular Expression )是用于匹配字符串中字符组合的模式.在 JavaScrip ...

javascript 正则表达式小案例

javascript 正则表达式小案例相关推荐

最新文章

热门文章