当前位置: 首页 > news >正文

多关键词高亮显示

引入关键词文件,符合有条件的背景色高亮显示,也可取消。

 <div id="testHtml"><p>写入的文本</p><p>关键词</p></div>
var str ='多个关键词,关键词文件,关键词'
var strL = str.replace(/,/g,'|')     //将关键词用竖线分割
function btnClick(){var Htmlstr = $("#testHtml").html()var reg = new RegExp('('+strL+')', 'g')$("#testHtml").html( Htmlstr.replace(reg,`<span style="background-color:#EEC900;">$1</span>`) )
}function removeBtnClick(){var Htmlstr = $("#testHtml").html()var reg = new RegExp('<span style="background-color:#EEC900;">(' + strL + ')</span>','gm')$("#testHtml").html( Htmlstr.replace(reg,`$1`) )
}

第二种方式,多种颜色高亮显示

var colors =  ["#ef0c0c","#EEC900","#9F79EE","#FFC1C1"]var keywordsdetail= []keywordsdetail = str.split(',')function  highlight(str,params) {var reg=new RegExp(("("+params.keys+")"),"gm");var color=params.color || '#f00';var replace='<span style="background-color:'+color+';">'+params.keys+'</span>';return str.replace(reg,replace);}
function btnClick(){//显示多种颜色关键词高亮按钮for(var i=0;i<keywordsdetail.length;i++){var params={keys:keywordsdetail[i],color:colors[i]}$("#testHtml").html(highlight($("#testHtml").html(),params));}}

相关文章:

多关键词高亮显示

引入关键词文件&#xff0c;符合有条件的背景色高亮显示&#xff0c;也可取消。 <div id"testHtml"><p>写入的文本</p><p>关键词</p></div> var str 多个关键词&#xff0c;关键词文件&#xff0c;关键词 var strL str.replac…...

浅谈 33 台 iPad 发展史;OpenAI“悄悄”修改了企业核心价值观丨 RTE 开发者日报 Vol.67

开发者朋友们大家好&#xff1a; 这里是 「RTE 开发者日报」 &#xff0c;每天和大家一起看新闻、聊八卦。我们的社区编辑团队会整理分享 RTE &#xff08;Real Time Engagement&#xff09; 领域内「有话题的 新闻 」、「有态度的 **观点 **」、「有意思的 数据 」、「有思考…...

Mysql之备份(Mysqldump)

本篇文章旨在介绍Mysql的备份&#xff0c;借助mysqldump命令。 1.准备数据 准备一个数据库d1&#xff0c;表t1 表结构如下&#xff1a; mysql> desc t1; ------------------------------------------------------- | Field | Type | Null | Key | Default | Extra …...

算法leetcode|84. 柱状图中最大的矩形(rust重拳出击)

文章目录 84. 柱状图中最大的矩形&#xff1a;样例 1&#xff1a;样例 2&#xff1a;提示&#xff1a; 分析&#xff1a;题解&#xff1a;rust&#xff1a;go&#xff1a;c&#xff1a;python&#xff1a;java&#xff1a; 84. 柱状图中最大的矩形&#xff1a; 给定 n 个非负整…...

Java中通过List中的stream流去匹配相同的字段去赋值,避免for循环去查询数据库进行赋值操作

List<EquipmentDeviceMessage> equipmentDeviceMessageInfo greenThinkTanksInfoPlanMapper.getEquipmentDeviceMessageInfo(phone, startDate, endDate); List<BladeUserVo> userList bladexsqlMapper.getUserList();Q&#xff1a;上面两个列表怎么使用流&#…...

开源酒店预订订房小程序源码系统+多元商户 前端+后端完整搭建教程 可二次开发

大家好啊&#xff0c;罗峰今天来给大家分享一款酒店预订订房小程序源码系统&#xff0c;这款系统进行了全新的升级&#xff0c;从原来的单门店升级成了多门店&#xff0c;可以自由切换账号&#xff0c;统一管理。功能强大。以下是部分代码截图&#xff1a; 酒店预订订房小程序源…...

Leetcode 2906. Construct Product Matrix

Leetcode 2906. Construct Product Matrix 1. 解题思路2. 代码实现 题目链接&#xff1a;2906. Construct Product Matrix 1. 解题思路 这道题其实算是一道数论题。 本来其实python的pow内置函数已经帮我们基本处理了所有的问题了&#xff0c;但是这里稍微做了一点复杂化操…...

【Leetcode Sheet】Weekly Practice 11

Leetcode Test 2731 移动机器人(10.10) 有一些机器人分布在一条无限长的数轴上&#xff0c;他们初始坐标用一个下标从 0 开始的整数数组 nums 表示。当你给机器人下达命令时&#xff0c;它们以每秒钟一单位的速度开始移动。 给你一个字符串 s &#xff0c;每个字符按顺序分别…...

本地PHP搭建简单Imagewheel私人云图床,在外远程访问

&#x1f525;博客主页&#xff1a; 小羊失眠啦 &#x1f516;系列专栏&#xff1a; C语言、Linux &#x1f325;️每日语录&#xff1a;追逐影子的人&#xff0c;自己就是影子。 ❤️感谢大家点赞&#x1f44d;收藏⭐评论✍️ 1.前言 云存储在前几年风头无两&#xff0c;云存…...

Python图像处理进阶:Pillow库的中级应用

在上一篇文章中&#xff0c;我们介绍了Python的Pillow库&#xff0c;了解了如何使用Pillow进行一些基础的图像操作。今天&#xff0c;我们将深入探讨Pillow库的中级功能&#xff0c;包括颜色空间转换&#xff0c;直方图&#xff0c;像素操作和绘制。 一、颜色空间转换 在图像…...

多线程怎么共用一个事务

文章目录 场景分析测试对应的其他类我并没有贴出来,因为大家可以自己找个项目走一波测试testSession测试testTransaction 注意使用同一个sqlsession会导致线程安全问题,testSession方法就是在另外线程里面能读取到数据库里面没有的数据.但是有时候业务就是这么奇怪.扩展总结 场…...

scrollIntoView使用与属性详解

scrollIntoView 使用与属性详解 效果图如下图所示 如果要想让元素滚动到指定位置 window.onload function () {containerItems[6].scrollIntoView({ behavior: "smooth" }); };js 代码 const containerItems document.querySelectorAll(".container div&…...

【LeetCode热题100】--169.多数元素

169.多数元素 使用哈希表&#xff1a; class Solution {public int majorityElement(int[] nums) {int n nums.length;int m n/2;Map<Integer,Integer> map new HashMap<>(); //定义一个hashfor(int num:nums){Integer count map.get(num); //Map.get() 方法…...

LeetCode 面试题 10.01. 合并排序的数组

文章目录 一、题目二、C# 题解 一、题目 给定两个排序后的数组 A 和 B&#xff0c;其中 A 的末端有足够的缓冲空间容纳 B。 编写一个方法&#xff0c;将 B 合并入 A 并排序。 初始化 A 和 B 的元素数量分别为 m 和 n。 示例: 输入: A [1,2,3,0,0,0], m 3 B [2,5,6], n 3 输…...

揭秘OLED透明拼接屏的参数规格:分辨率、亮度与透明度全解析

作为一种新型的显示技术&#xff0c;OLED透明拼接屏在市场中正在迅速崭露头角&#xff0c;有很多知名品牌厂家能设计、开发、生产高品质的显示产品。 如尼伽、起鸿、康视界、LG、YCTIMES、腾裕等&#xff0c;这些品牌在显示技术领域拥有丰富的经验和声誉&#xff0c;以其卓越的…...

竞赛选题 深度学习YOLOv5车辆颜色识别检测 - python opencv

文章目录 1 前言2 实现效果3 CNN卷积神经网络4 Yolov56 数据集处理及模型训练5 最后 1 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; **基于深度学习YOLOv5车辆颜色识别检测 ** 该项目较为新颖&#xff0c;适合作为竞赛课题方向&#xff0…...

linux U盘无法使用,提示“Partition table entries are not in disk order“

问题&#xff1a; U盘在Windows上使用正常&#xff0c;在linux下无法使用fdisk -l 命令提示&#xff1a;Partition table entries are not in disk order $ fdisk -l Disk /dev/sdb: 525 MB, 525336576 bytes 17 heads, 59 sectors/track, 1022 cylinders Units cyl…...

HDLbits: Fsm ps2

本题目理解起来有点难&#xff0c;要观察题目中给的三个时序图&#xff0c;通过时序图可以发现&#xff0c;状态有四个&#xff1a;byte1、byte2、byte3&#xff0c;还有一个“&#xff1f;”状态。其中&#xff0c;byte1的下一个状态一定是byte2&#xff0c;byte2的下一个状态…...

【设计模式】八、桥接模式

文章目录 举例问题分析基本介绍桥接模式在 JDBC 的源码剖析桥接模式的注意事项和细节JDBC 举例 现在对不同手机类型的不同品牌实现操作编程(比如:开机、关机、上网&#xff0c;打电话等)&#xff0c; 传统方法对应的类图&#xff1a; 问题分析 扩展性问题(类爆炸)&#xff…...

从零开始的stable diffusion

stable diffusion真的是横空出世&#xff0c;开启了AIGC的元年。不知你是否有和我一样的困惑&#xff0c;这AI工具好像并不是那么听话&#xff1f; 前言 我们该如何才能用好stable diffusion这个工具呢&#xff1f;AI究竟在stable diffusion中承担了什么样的角色&#xff1f;如…...

XCTF-web-easyupload

试了试php&#xff0c;php7&#xff0c;pht&#xff0c;phtml等&#xff0c;都没有用 尝试.user.ini 抓包修改将.user.ini修改为jpg图片 在上传一个123.jpg 用蚁剑连接&#xff0c;得到flag...

【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15

缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下&#xff1a; struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...

Swift 协议扩展精进之路:解决 CoreData 托管实体子类的类型不匹配问题(下)

概述 在 Swift 开发语言中&#xff0c;各位秃头小码农们可以充分利用语法本身所带来的便利去劈荆斩棘。我们还可以恣意利用泛型、协议关联类型和协议扩展来进一步简化和优化我们复杂的代码需求。 不过&#xff0c;在涉及到多个子类派生于基类进行多态模拟的场景下&#xff0c;…...

《通信之道——从微积分到 5G》读书总结

第1章 绪 论 1.1 这是一本什么样的书 通信技术&#xff0c;说到底就是数学。 那些最基础、最本质的部分。 1.2 什么是通信 通信 发送方 接收方 承载信息的信号 解调出其中承载的信息 信息在发送方那里被加工成信号&#xff08;调制&#xff09; 把信息从信号中抽取出来&am…...

如何将联系人从 iPhone 转移到 Android

从 iPhone 换到 Android 手机时&#xff0c;你可能需要保留重要的数据&#xff0c;例如通讯录。好在&#xff0c;将通讯录从 iPhone 转移到 Android 手机非常简单&#xff0c;你可以从本文中学习 6 种可靠的方法&#xff0c;确保随时保持连接&#xff0c;不错过任何信息。 第 1…...

HBuilderX安装(uni-app和小程序开发)

下载HBuilderX 访问官方网站&#xff1a;https://www.dcloud.io/hbuilderx.html 根据您的操作系统选择合适版本&#xff1a; Windows版&#xff08;推荐下载标准版&#xff09; Windows系统安装步骤 运行安装程序&#xff1a; 双击下载的.exe安装文件 如果出现安全提示&…...

C# 类和继承(抽象类)

抽象类 抽象类是指设计为被继承的类。抽象类只能被用作其他类的基类。 不能创建抽象类的实例。抽象类使用abstract修饰符声明。 抽象类可以包含抽象成员或普通的非抽象成员。抽象类的成员可以是抽象成员和普通带 实现的成员的任意组合。抽象类自己可以派生自另一个抽象类。例…...

零基础设计模式——行为型模式 - 责任链模式

第四部分&#xff1a;行为型模式 - 责任链模式 (Chain of Responsibility Pattern) 欢迎来到行为型模式的学习&#xff01;行为型模式关注对象之间的职责分配、算法封装和对象间的交互。我们将学习的第一个行为型模式是责任链模式。 核心思想&#xff1a;使多个对象都有机会处…...

爬虫基础学习day2

# 爬虫设计领域 工商&#xff1a;企查查、天眼查短视频&#xff1a;抖音、快手、西瓜 ---> 飞瓜电商&#xff1a;京东、淘宝、聚美优品、亚马逊 ---> 分析店铺经营决策标题、排名航空&#xff1a;抓取所有航空公司价格 ---> 去哪儿自媒体&#xff1a;采集自媒体数据进…...

如何在网页里填写 PDF 表格?

有时候&#xff0c;你可能希望用户能在你的网站上填写 PDF 表单。然而&#xff0c;这件事并不简单&#xff0c;因为 PDF 并不是一种原生的网页格式。虽然浏览器可以显示 PDF 文件&#xff0c;但原生并不支持编辑或填写它们。更糟的是&#xff0c;如果你想收集表单数据&#xff…...