export function numberToColor(text, color = '#635BFF', size = '12px') {

  let reg = /(\d+)/g;

  return text.replace(reg, `<span style="color: ${color};size: ${size}">$1</span>`);

}

效果：

React.js 修改文本中数字样式的更多相关文章

  1. JS修改标签中的文本且不影响其中标签

    /********************************************************************* * JS修改标签中的文本且不影响其中标签 * 说明: * ...

  2. 【百度地图API1.1】修改文本标注的样式

    原文:[百度地图API1.1]修改文本标注的样式 百度地图API1.0中文本标注的样式写法为: label.getDom().style.borderColor = "#808080&quo ...

  3. JS实现文本中查找并替换字符

    JS实现文本中查找并替换字符 效果图: 代码如下,复制即可使用: <!DOCTYPE html><html> <head> <style type=" ...

  4. js修改html中class属性

    document.getElementById("tr").setAttribute("class","styleclass"); 其中  ...

  5. react之四种组件中DOM样式设置方式

    1.行内样式 想给虚拟dom添加行内样式,需要使用表达式传入样式对象的方式来实现 行内样式需要写入一个样式对象,而这个样式对象的位置可以放在很多地方 例如:render函数里.组件原型上.外链js文件 ...

  6. js验证文本框数字

    输入框 <input name="title" type="text" oninput="onlyNum(this,'')" titl ...

  7. js修改文档的样式

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>Java ...

  8. js 修改字符串中某些字符的样式

    var str = 'abcdefghijklmnobqrstuvwxyz'; function HightLight(e){ var reg = new RegExp(e, 'g') str = s ...

  9. 在react.js上使用antd-design没有样式

    两种解决方法: 第一种: 在.babelrc中加入 { "presets": ["es2015", "react"], "plug ...

  10. config.js配置页面中的样式和图片路径

    这个文章用在什么地方,我先说一下,上周啊,我接到一个任务.因为公司业务要对接不同的银行,例如在工行下颜色是红色的,在其他银行下默认为蓝色,所以在页面一致的情况下,保证页面中的按钮和ICON是可以配置的 ...

随机推荐

  1. 记一次CVE实战挖掘记录

    CVE实战挖掘记录 前一段时间在学习代码审计,然后为了学习就开始在github上面找开源的项目进行练手学习代码审计,这样就可以获取CVE编号. 0x01 cve编号获取流程 首先登录CVE官方网站,选 ...

  2. 程序员大杀器？带你玩转ChatGPT

    作者:京东零售 栗鸿宇 ChatGPT简介 ChatGPT是一款基于AI技术的机器人对话软件,它能够与用户进行智能化的聊天对话,帮助用户解决日常生活中的问题,为用户提供丰富的信息和服务.它集成了海量知 ...

  3. 100 行 shell 写个 Docker

    作者:vivo 互联网运维团队- Hou Dengfeng 本文主要介绍使用shell实现一个简易的Docker. 一.目的 在初接触Docker的时候,我们必须要了解的几个概念就是Cgroup.Na ...

  4. 【Oculus Interaction SDK】（五）设置不同的抓握手势

    前言 这篇文章是[Oculus Interaction SDK]系列的一部分,如果发现有对不上的对方,可以回去翻看我之前发布的文章,或在评论区留言.如果文章的内容已经不适用于新版本了,也可以直接联系我 ...

  5. you-get下载B站视频

    you-get下载B站视频 库存 you-get介绍 https://github.com/soimort/you-get you-get是一个命令行工具,可以下载知名网站的视频 支持的网站有  ht ...

  6. http八股 跨域的本质 请求行 请求头 请求体 xss

    1小八股 介绍 http 请求分为三个部分,请求行,请求头,请求体 还有状态码的含义 https://juejin.cn/post/7096317903200321544 2tips Content- ...

  7. 微信小程序 添加域名

    1.不校验合法域名.web-view (业务域名).TLS版本以及 HTTPS证书 2.小程序上的请求=>服务器的根地址=>都需要添加微信公众平台(否则会无法发送请求,导致代码报错)

  8. XAMPP环境下数据库密码保存文件目录(数据库密码忘记)

    转自百度经验: https://jingyan.baidu.com/article/09ea3ede4e2523c0afde3943.html ---------------------------- ...

  9. 取出每个分组的的第一条数据sql

    select * from(select id,detail, ROW_NUMBER()over(PARTITION By detail ORDER BY detail DESC) as rnfrom ...

  10. 解决Revit导出FBX模型材质丢失的问题

    初次使用Revit导出fbx格式模型,在导出模型后发现模型材质丢失了,上网查询之后也没到具体原因是什么,不过倒是找到了解决方式:在Revit中安装naviswork插件,然后从revit中导出nwc格 ...