正则表达式 - 替换和分组

替换和分组:

替换使用 | 字符来允许在两个或多个替换选项之间进行选择。

/^Chapter|Section [1-9][0-9]{0,1}$/

上面的正则表达式要么匹配行首的单词 Chapter,要么匹配行尾的单词 Section 及跟在其后的任何数字。如果输入字符串是 Chapter 22,那么上面的表达式只匹配单词 Chapter。如果输入字符串是 Section 22,那么该表达式匹配 Section 22。

可以使用括号来限制替换的范围,即,确保它只应用于两个单词 Chapter 和 Section。

/^(Chapter|Section) [1-9][0-9]{0,1}$/

尽管这些表达式正常工作,但 Chapter|Section 周围的括号还将捕获两个匹配字中的任一个供以后使用。若要防止匹配被保存以备将来使用,请在括号内正则表达式模式之前放置 ?:。下面的修改提供相同的能力而不保存子匹配项:

/^(?:Chapter|Section) [1-9][0-9]{0,1}$/

除 ?: 元字符外,两个其他非捕获元字符创建被称为"预测先行"匹配的某些内容。

正向预测先行使用 ?= 指定,它匹配处于括号中匹配正则表达式模式的起始点的搜索字符串。

反向预测先行使用 ?! 指定,它匹配处于与正则表达式模式不匹配的字符串的起始点的搜索字符串。

例如,一个文档包含指向 Windows 3.1、Windows 95、Windows 98 和 Windows NT 的引用。需要更新该文档,将指向 Windows 95、Windows 98 和 Windows NT 的所有引用更改为 Windows 2000。下面的正则表达式(这是一个正向预测先行的示例)匹配 Windows 95、Windows 98 和 Windows NT:

/Windows(?=95 |98 |NT )/

找到一处匹配后,紧接着就在匹配的文本(不包括预测先行中的字符)之后搜索下一处匹配。例如,如果上面的表达式匹配 Windows 98,将在 Windows 之后而不是在 98 之后继续搜索。

 

实际使用中的例子:

// 遍历HTML中src的图片地址
var str = '\
<img src="//img.test.com/images/2.jpg"/>\
<img src="//img.test.com/images/3.jpg"/>\
<img class="lazy" data-original="//img.test.com/images/4.jpg" />\
<img class="lazy" data-original="//img.test.com/images/5.jpg" />\
<img class="lazy" data-original="//img.test.com/images/6.jpg" />\
';

var pattern = /(?:src=|data-original=)[\'\"]?([^\'\"]*)[\'\"]?/gi;
// ^ 匹配输入字符串的开始位置,在方括号中使用时,表示不接受该字符集合

var img_arr = [];
var img_obj = [];

while(img_obj = pattern.exec(str)){
    img_arr.push(img_obj[1]);
}
console.log('\n', img_arr, '\n');

 

修改时间 2021-12-23

声明:本站所有文章和图片,如无特殊说明,均为原创发布。商业转载请联系作者获得授权,非商业转载请注明出处。
随机推荐
JavaScript document 对象
JavaScript 引用类型
HTML input datetime 日期时间选择器
Wordpress 使用 tag 标签获取文章列表的方法
Web 自定义组件
ES6 Promise 和 async/await 教程
JavaScript ES6 模块
Node.js MySQL 连接池和事务