js匹配两个特殊字符中间内容的正则以及html标签之间内容的匹配

匹配两个特殊字符

匹配两个特殊字符中间的内容,比如¥1234¥ 要匹配两个¥之间的数字:

// 使用正则
let reg = /(?<=¥).*?(?=¥)/;
let str = '¥1234¥';
// 使用
str.match(reg); // 输出 ['1234']

js匹配两个特殊字符中间内容的正则以及html标签之间内容的匹配_第1张图片
在这里不包含前面匹配的字符写法(?<=要匹配的开始字符),不包含后面要匹配的字符写法(?=要匹配的结束字符)

有了以上直接匹配特殊字符中间内容的方式,如果带上所要匹配的字符就更直接了

'¥1234¥'.match(/¥.*?(?=¥)/)[0]; // 输出 ¥1234

'¥1234¥'.match(/(?<=¥).*?¥/)[0]; // 输出 1234¥

'¥1234¥'.match(/¥.*?¥/)[0]; // 输出 ¥1234¥

不要觉得最后一种方式没有用的感觉,最后一种是在例如:

// 这样的字符串中抽离,以上其他方式一样,只是根据需要的结果使用就好
'das23213123¥1234¥dsaada31'.match(/¥.*?¥/)[0]; // 输出 ¥1234¥

匹配HTML标签之间的内容

有了上方匹配特殊字符的方式,直接将特殊字符改为html的标签即可,这里采用的单一标签的匹配方式,比如只匹配a标签或p标签等,话不多说上代码:

let dom = '
这个是内容一这个是内容二
'
; let domReg = /(?<=(]*?>)).*?(?=(<\/span>))/g; dom.match(domReg);

输出如下:
js匹配两个特殊字符中间内容的正则以及html标签之间内容的匹配_第2张图片
这是以span标签为例,你也可以将span改成其他标签,div,p标签等都可以。

批量处理匹配到的html内容

根据上边html的正则匹配,我们来对匹配到的内容做进一步的处理,经常会遇到要对某一种标签的内容增加修饰,比如将颜色统一改为绿色,代码如下:

let dom = '
这个是内容一这个是内容二
'
; let domReg = /(?<=(]*?>)).*?(?=(<\/span>))/g; dom = dom.replace(domReg, (str) => { console.log('正则匹配到的内容', str); return `${str}`; });

完整代码实例:

DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Documenttitle>
head>

<body>
  <h1>JS匹配特殊字符之间的内容以及标签内容h1>
  <div id="content">div>
body>
<script>
  let dom = '
这个是内容一这个是内容二
'
; let domReg = /(?<=(]*?>)).*?(?=(<\/span>))/g; dom = dom.replace(domReg, (str) => { console.log('正则匹配到的内容', str); return `${str}`; }); document.getElementById('content').innerHTML = dom;
script> html>

以上就是这次所分享内容。
如有疑问可以留言,也可以到QQ群一起探讨:
QQ群1: 657011407, QQ群2: 492593055,也可以到微信找我 shenzhipeng1023

你可能感兴趣的:(js代代码库,匹配特殊字符中间内容,匹配两个特俗字符中间内容,匹配html标签之间内容,批量修改html标签之间内容)