通过 replace() 和正则实现 将文本中的所有数字颜色高亮

news/2024/5/19 21:29:14/文章来源:https://blog.csdn.net/qq_44603011/article/details/126636121

实现的效果:

用到的知识点:

replace()  方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。 

repalce( a, b ) 必须传两个值,其中a 是要替换的文本,或者满足条件的正则。

b是 要替换成的文本或内容。

其中b的值可为:

 详见:JavaScript replace() 方法

具体代码:

        numHandle(){ // 数字处理var regex = new RegExp("\\d",'g')console.log(regex);var content='完成设备巡检15件,帐卡一致9件,有帐无物3件,有物无帐2件,帐卡匹配错误1件,现场实物ID附码率80%。'// replace中的 $& 为匹配到的元素,// new RegExp('\\d|\\%','gm') \\d表示匹配数组,| 表示或 ,\\%表示匹配% ,g 表示全局匹配,m表示全局的循环var a = content.replace(new RegExp('\\d','gm'),`<span style="color:red">${'$&'}</span>`)console.log(a);},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_381451.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

javaweb JAVA JSP球鞋销售系统购物系统ssm购物系统购物商城系统源码(ssm电子商务系统)

JSP球鞋销售系统购物系统ssm购物系统购物商城系统源码&#xff08;ssm电子商务系统&#xff09;

生产和同城存储双活架构下,发生脑裂问题影响数据库读写,如何快速分析问题和解决问题?

数据中心脑裂问题,简单说就是两个数据中心间的网络和存储链路同时发生中断,导致两个数据中心内的应用、数据库或者操作系统同时抢占和利用共享的资源,造成资源的数据不一致,产生重大影响。如何避免脑裂是每个存储双活方案都需要尤为重视的问题,脑裂会带来长时间的存储读写…

linux上redis单机的安装

1. 官网下载 https://github.com/redis/redis/archive/7.0.4.tar.gz 2. 上传到虚拟机/data/目录下、解压 tar -xzvf redis-7.0.4.tar.gz 3. 进入redis-7.0.4此目录 cd redis-7.0.4;ll 4. 安装到指定目录中 a. mkdir /usr/local/redis b. make PREFIX/usr/local/redis inst…

沃尔玛、eBay、wish、新蛋等美系平台对于测评风控点有哪些?怎么解决

很多人把各大平台风控想得过于简单&#xff0c;以为注册一批买家账号配一个IP就能进行下单上评&#xff0c;这也是导致市面上的测评现象杂乱无章。但是一定要明白一点各大电商平台都是一家数据公司他的算法一定是根据市场的变化而不断调整的。 平台检测的方式有很多种 1、平台…

RabbitMQ入门(二)

1.概述 RabbityMQ整体上是一个生产者和消费者模式。生产者生产消息到消息中间件的服务节点&#xff08;Broker&#xff09;,服务节点中包含交换器&#xff08;Exchange&#xff09;和队列&#xff08;Queue&#xff09;&#xff0c;生产的消息首先经过交换器&#xff0c;再由交…

搭建vue3项目

搭建vue3项目搭建准备创建项目选择所需配置运行项目vue3已经被大众所熟悉&#xff0c;很多公司都在做vue2到vue3的升级。 介绍vue3项目的搭建过程 搭建准备 前端开发环境需要node.js&npm node下载地址:http://nodejs.cn/download/ 根据自己电脑环境下载就行 安装vue-cli3…

2022/08/31 day14:企业级解决方案

文章目录目录缓存预热缓存雪崩缓存击穿缓存穿透性能指标监控总结目录 面试问题 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-EtBtkGNE-1661933471760)(en-resource://database/5507:1)] [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下…

抖音小程序模板全行业整理合集,抖音小程序制作平台分享

小弟我是来自第三方抖音小程序制作平台的打工人&#xff0c;给大家整合了一些我们平台的抖音小程序模板&#xff0c;大家可以根据需要来获取。 步骤就是点击下方的链接&#xff0c;选好自己的抖音小程序模板&#xff0c;在平台注册账号直接套用到自己的抖音小程序上&#xff0…

深入理解蓝牙BLE之“信道管理”

目录 一.BLE的调制解调&#xff1a; 二.BLE的信道&#xff1a; 三.BLE的广播信道&#xff1a; 四.BLE的数据信道&#xff1a; 五.BLE信道管理&#xff1a; 5.1广播信道的随机延时&#xff1a; 5.2数据信道的调频算法&#xff1a; 跳频算法1&#xff1a; 跳频算法2&…

02.Haoop 虚拟机 桥接与NAT之间区别 及桥接设置

首先说 我的硬件准备&#xff0c;1台windows系统&#xff0c;1台mac pro 。 在 物理机上使用了 VMWARE CENTOS 7 的 方式进行配置。 那么我希望能实现把 这2台机器连在一起&#xff0c;做Hadoop 的集群。 网络问题是首先需要解决的事情&#xff0c;主要不通物理主机之间一直…

02:入门及安装(狂神说RabbitMQ)

RabbitMQ入门及安装 https://www.bilibili.com/video/BV1dX4y1V73Gp27 概述 简单概述&#xff1a; RabbitMQ是一个开源的遵循 AMQP协议实现的基于 Erlang语言编写&#xff0c;支持多种客户端&#xff08;语言&#xff09;&#xff0c;用于在分布式系统中存储消息&#xff0…

Spring Security 入门之自定义表单登录开发实现(三)

文章目录1. 前言2. 自定义认证2.1 自定义登录页面2.2 后端认证逻辑3. 自定义登陆成功处理3.1 登陆成功原理3.2 自定义登陆成功响应处理4. 自定义登陆失败处理4.1 登陆失败原理4.2 自定义登陆失败响应处理5. 注销用户处理5.1 注销原理总结1. 前言 在弄懂HelloWorld案例后&#…

Node.js | 使用内置模块 event 实现发布订阅模式

&#x1f5a5;️ NodeJS专栏&#xff1a;Node.js从入门到精通 &#x1f5a5;️ 蓝桥杯真题解析&#xff1a;蓝桥杯Web国赛真题解析 &#x1f9e7; 加入社区领红包&#xff1a;海底烧烤店ai&#xff08;从前端到全栈&#xff09; &#x1f9d1;‍&#x1f4bc;个人简介&#xff…

自动化测试中的验证码问题

做自动化测试的同学在面试的时候经常会遇到这问题&#xff0c;而且我们在实际的工作中也会遇到这个问题&#xff0c;那么这问题到底该怎么处理&#xff1f; 下面给出了面试过程中常见的相关面试题供大家参考&#xff1a; 01 在做自动化登陆的同时&#xff0c;如何绕过验证码&a…

windows下安装docker

下载docker&#xff0c;通过Redirecting…这个下载docker 正在上传…重新上传取消 下载完安装 安装完成后&#xff0c;进入powershell&#xff0c;输入命令docker network ls,查看docker网络&#xff0c;如果没有bridge项目&#xff0c;创建容器会报错(Windows容器就是两…

3D格式转换神器HOOPS Exchange使用教程(一):打印组件结构

HOOPS Exchange是什么&#xff1f; HOOPS Exchange 是一组软件库&#xff0c;可以帮助开发人员在开发应用程序时读取和写入主流的 2D 和 3D 格式。HOOPS Exchange 支持在主流的3D 文件格式中读取 CAD 数据&#xff0c;并支持将 3D 数据转换为 PRC 数据格式&#xff0c;这是一种…

NGINX源码之:event与epoll

在进入正题之前&#xff0c;先来大概了解下epoll&#xff1a; 引入多路复用之前socket建立连接流程&#xff1a; 1、服务端先建立socket&#xff08;serversocket&#xff09;占用一个文件描述符fd,然后bind端口&#xff0c;开启监听listen accept事件&#xff1b; 2、客户端请…

有趣的前端项目——一个暴躁萌的大眼仔

有趣的前端项目——一个暴躁萌的大眼仔 众所周知&#xff0c;我是一个摆子前端&#xff08;真的 &#xff09;&#xff0c;闲来无事&#xff0c;网上冲浪 遇见了如此蠢萌的大眼 于是我&#xff0c;行也思&#xff0c;坐也思&#xff0c;可算把这个大眼给复刻出来了。 原文出…

01-Flink概述

1. 源起和设计理念https://flink.apache.org/在 Flink 官网主页的顶部可以看到,项目的核心目标,是“数据流上的有状态计算”(Stateful Computations over Data Streams)。 具体定位是:Apache Flink 是一个框架和分布式处理引擎,如下图所示,用于对无界和有界数据流进行有…

利用逻辑分析仪处理CAN协议数据

1.设置逻辑分析仪 设置合适的采样频率和软件定义的波特率500K 2.数据分析 实测SOF的宽度是2us&#xff0c;因此可计算出波特率为500K&#xff0c;与实际程序设置的速率一致。 取图中的一部分数据分析&#xff0c;从左往右看&#xff1a; 0|| 000 0[1]001 0010 0|| 000 1000 …