JS-字符串的replace方法配合正则的使用

最新推荐文章于 2023-05-22 17:52:20 发布
最新推荐文章于 2023-05-22 17:52:20 发布
阅读量220 收藏
点赞数
分类专栏： JavaScript 编码技巧 文章标签： javascript 字符串 正则表达式
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46873254/article/details/119576505
版权 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script>
        //需求：让字符串中的所有的 a 高亮显示， 不区分大小写 
        //原理把 a 替换成 <span style="color:red">a</span>   

        let str = 'abcABCaa123AA123bbcc';
        document.body.innerHTML += str + '<br>';

        //1.直接替换
        /* 
        发现问题： 只能替换第一个小写a
        原因： replace方法默认只能匹配第一个
        解决： 使用正则表达式
            修饰符 g : 全局匹配
            修饰符 i : 不区分大小写
        */
        let res1 = str.replace('a','<span style="color:red">a</span>');
        document.body.innerHTML += res1 + '<br>';

        //2.使用正则
        //第一个参数：正则  第二个参数： 修饰符  g: global全局匹配
        let reg = new RegExp(/a/ig);
        let res2 = str.replace(reg,'<span style="color:red">a</span>')
        document.body.innerHTML += res2 + '<br>';


        //2.使用正则替换
        /* 
        发现问题1： 默认正则也只能替换第一个
        解决方案1： 使用修饰符 g : 全局匹配

        发现问题2： 默认只能替换小写a
        解决方案2： 使用修饰符 i : 不区分大小写

        发现问题3： 不区分大小写之后， 原来大写A ， 也被替换成小写a
        需求: 只是修改a或A的颜色
        解决方案3： 使用replace的替换函数
        */

       //第一个参数： 匹配条件   string | RegExp
       //第二个参数： 替换结果   string | function 
       /* 
       match=>{ return 值 }    match；当前匹配结果   return 值： 当前替换值
            这个回调函数会执行多次， 你的正则能匹配到几个，这个回调函数就会执行几次
       */
       let res3 =  str.replace(/a/ig,match=>{
           return `<span style="color:red">${match}</span>`
       });
       document.body.innerHTML += res3;

    </script>
</body>
</html>
SpringSir
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js强大函数replace详解，利用其做模板方法与数据绑定
satisfy
07-07 4048
1.预备知识 先复习一下正则表达式， 正则表达式基础知识  //星号(*) : 星号代表匹配它前面一个字符任意遍(0或任意次) //加号(+): 加号是一个与星号(*)类似的通配符，它也是数量词，表示匹配前面的字符一次或多次（至少一次). //它与星号的差别就在这里，星号可以匹配0次，加号则必须一次以上。 //问号(?): 问号也是一个数量词，它代表匹配前一个
JS正则 replace() 的使用
SoulArbiter的博客
05-30 6306
stringObject.replace(regexp/substr,replacement)这是W3C给出的关于replace()的用法，它有两个参数，第一个参数为被匹配的字符或正则，第二个参数常为字符串即待操作的原字符串。简单地引用W3C的例子：var str="Visit Microsoft!" document.write(str.replace(/Microsoft/, "W3Schoo...
JS利用正则配合replace替换指定字符的方法
最新发布
xiaoweids的博客
05-22 643
接下来的参数是与模式中的子表达式匹配的字符串，可以有 0 个或多个这样的参数。字符串 stringObject 的 replace() 方法执行的是查找并替换的操作。regexp　必需。替换指定字符的方法有很多，在本文为大家详细介绍下，JS利用正则配合replace是如何做到的，喜欢的朋友可以参考下。一个新的字符串，是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
JavaScript中的replace()方法替换所有匹配项
lkforce
03-08 5261
在项目中，试图把页面文本域中的文字的换行符(\n)替换为竖线(|)，使用了JavaScript中的replace()方法： var value=$(this).val().replace("\n","|"); 后来发现这么写只能匹配并替换第一次匹配到的换行符，后面的换行符就不会匹配了，上网研究了一下，这么写确实只是匹配并替换第一次匹配的内容的。 想要全部匹配，可以使用replace(
js正则的括号,类型,通配符
weixin_30613343的博客
02-27 543
alert("12345678用正则把数字用逗号分开："+"12345678".replace(/(-?\d+)(\d{3})/,"$1,$2"));alert("test@126.com用正则分隔："+'test@126.com'.replace(/(.+)(@)(.*)/,"$3===$2===$1"));alert("手机号判断："+/1[3-9]\d{9}/.test(1313611...
正则表达式和Spring支持的正则表达式
zhang01232的博客
09-20 1356
用于描述字符串内容格式，使用它通常用于匹配一个字符串的内容是否符合格式要求。
Js-正则替换字符串replace()方法超详细用法
qq_45458749的博客
05-05 2万+
replace方法它接收一个正则表达式作为第一个参数, 接收一个替换字符串作为第二个参数。 它搜索调用它的字符串, 寻找与指定模式匹配的文本。 如果正则表达式带g标志, replace()方法会替换字符串中的所有匹配项; 否则, 它只替换第一个匹配项。 如果replace()方法的第一个参数是一个字符串而非正则表达式, 这个方法会按照字面值进行搜索。 简单用法 let text = 'my nam
JS：正则表达式中的替换 replace(内容包含匹配模式)
weixin_46682277的博客
07-13 1万+
replace()方法可以实现替换字符的操作，用来替换的参数可以是字符串或正则表达式。 语法格式： // 第一个参数：被替换的可以是字符串也可以是正则表达式 // 第二个参数：替换为新的字符串 // 它返回的值是一个替换完的新字符串，需要接收过来 str.replace(reg/str,ele); 字符串替换代码示例： // 字符串中的替换replace var str = "孙悟空和唐僧"; // 把孙悟空替换为了猪八戒 var news
js 正则中 replace() 使用
qq_42744920的博客
07-18 5240
正则中 使用replace
JS replace的几种简单用法
xingzhezhige的专栏
10-13 1431
一、常规替换（单个替换，只能替换第一个）：         oldsql = oldsql.replace(“type=1”,"1=1"); 二、正则表达式全部替换：         var sqli = “type=1”;//这里sqli是动态传入的参数         var reg = new RegExp(sqli,"g");         oldsql = oldsql.
JS replace替换字符串所有匹配字符
weixin_43866528的博客
03-19 1394
这里写自定义目录标题replace 替换一个replace 替换所有 之前竟然一直没发现，以为前端的replace和后端的replace方法作用相同，都是替换字符串中所有指定字符，其实不然的。 replace 替换一个 let str = "2021-03-19"; console.log(str.replace('-', '/')); 输出结果 2021/03-19 当时都没注意到，使用后才发现返回值问题，使用时注意细节噢！ replace 替换所有 let str = "2021-03-19
js replace方法
热门推荐
zxl1990_ok的博客
04-26 2万+
replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串 语法：stringObject.replace(regexp/substr,replacement) 说明：regexp/substr（必须），规定子字符串或要替换的模式的RegExp对象。如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为RegExp对象。 replacem...
代替replace通配符的一种方式
cq78997814的博客
04-02 1353
代替replace通配符的一种方式 SQL语句中使用Replace进行字符串替换的频率比较高，有好多同仁们想通过通配符的方式进行替换，以便于更加灵活，比如：replace(‘aa-bb-cc’,’-%-,’’)，想要得到aacc的结果，但是Replace函数不支持，也有利用正则表达式的形式进行，但个人认为存在一定缺陷。供大家参考。 比如：我们仍想做在’aa-bb-cc’中得到aacc的结果，‘aa-bb-cc’所在字段名为’替换字段’，可以试着用以下方法进行； CASE WHEN 替换字段 like '%-
js正则替换replace中$1的用法以及常用正则
晴树的专栏
07-22 1万+
一、repalce定义 用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。 1 2 3 4 5 stringObject.replace(regexp/substr,replacement)； 参数一：必需，规定的字符串或者正则表达式 参数二：必需，一个字符串值。规定了替换文本或生成替换文本的函数。 ！！！replacement 中的 $ 字符具有特定的含义。详情见W3C .
Spring url正则匹配实现
zhaoyang10的专栏
07-16 1888
public static void main(String[] args) { String matchUrl = "/api/**"; String url = "/api/ams/list"; boolean flag = match(matchUrl, url); System.out.println(flag); } private static PathMatcher matcher = new AntPathMatc
java使用replaceAll的正则表达式替换，非常好用
有 prepare , No out
01-11 4723
package com.blog.test; import java.util.regex.Matcher; import java.util.regex.Pattern; public class TEst { public static void main(String[] args) { String s=">213<<"; // String regex="[\
正则匹配到以某字符开始以某字符结束的字符，并替换成别的字符串
shadow_yi_0416的博客
10-13 1069
需求是找到emoi的表情字符串。这类字符串都有一个共同的特点，就是以&#开始，以；结束。找到后在前后加上空格，让它可以正常显示 // 正则如下 let reg = /&#[^&#|;]*?;/g 替换的方法如下 html.replace(reg, value => { console.log(value, 'value') return "<span>" + value + "</span>" })
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值