一、程序案例代码

<!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>JS实现HTM搜索关键词高亮显示</title><style>.search {color: red;}</style>
</head><body><div id="demo"></div>
</body>
<script >// JS实现HTM搜索关键词高亮显示/*** kw:搜索关键词* text:待匹配的文本**/function redKeywords(kw, text) {var reg = /<script[^>]*>(.|\n)*<\/script>/gi; //去掉script标签 text = text.replace(reg, "");var num = -1;var kwReg = new RegExp(kw, "gi"); //匹配传入的搜索值不区分大小写 i表示不区分大小写，g表示全局搜索var htmlReg = new RegExp("\<.*?\>", "ig"); //匹配html元素var aHtml = text.match(htmlReg); //存放html元素的数组var arr = text.match(kwReg);a = -1;text = text.replace(htmlReg, '{~}'); //替换html标签text = text.replace(kwReg, function () {a++;return "<span class='search'>" + arr[a] + "</span>"}); //替换keytext = text.replace(/{~}/g, function () { //恢复html标签num++;return aHtml[num];});return text;}document.getElementById("demo").innerHTML = redKeywords("随机森林", "作为新兴起的、高度灵活的一种机器学习算法，随机森林（Random Forest，简称RF）拥有广泛的应用前景，从市场营销到医疗保健保险，既可以用来做市场营销模拟的建模，统计客户来源，保留和流失，也可用来预测疾病的风险和病患者的易感性。最近几年的国内外大赛，包括2013年百度校园电影推荐系统大赛、2014年阿里巴巴天池大数据竞赛以及Kaggle数据科学竞赛，参赛者对随机森林的使用占有相当高的比例。所以可以看出，Random Forest在准确率方面还是相当有优势的。")
</script></html>

二、程序运行效果

JS实现HTM搜索关键词高亮显示相关推荐

js实现html搜索关键词高亮显示（标红）
效果图: 一.只适用于找出中文如果传入英文会特别麻烦,因为比如传个a,innerHtml匹配时会匹配到包含a的标签比如<span>.<a>等. 思路: 获取body的inne ...
C#中搜索关键词高亮显示
在搜索关键词高亮中一般的方法都是采用替换的办法(Replace)这个方法有一个缺点就是不能区分大小写的问题.在网上找了找发现有人用正则表达式的方法来解决这个问题还真不错,效率也比较高,归纳如下,有用得 ...
android关键词检索功能,Android实现搜索关键词高亮显示-Kotlin
在做Wandroid项目时有一个搜索功能,要在搜索结果中将匹配到的关键词高亮显示.但是玩安卓API并没有提供颜色的高亮,只有字体斜体,效果看起来并不明显,并且昵称也参与了搜索,但并没有增加HTML标 ...
js 获取百度搜索关键词的代码
有可能有时候我们会用到在百度搜什么关键词进来我们的网站的,所有我们又想拿到用户搜索的关键词. 这是我研究了半天所得出的办法.话不多说直接贴代码 <script>function query ...
Vue---实现搜索功能的搜索关键词高亮显示
1.模板代码: <div v-html="hightligth(text)"></div> text为自己的文本搜索结果,比如黄某某例子: 现在我的搜索关 ...
javascript(js)获取访客通过搜索引擎进入页面的搜索关键词的简洁有效代码
最近需要用到这么一个功能,就是如果用户是通过搜索引擎进来浏览页面的,那么就通过js获取其搜索关键词,找了很久,终于找到一个比较好用而且又简洁的代码,在此也感谢分享者,搜索引擎只包括谷歌和百度的,其他类 ...
php 百度来路关键词,php获取百度搜索关键词的方法[方法过时了]
本来是想找一段通过js获取百度关键词的方法的,结果找并且测试获取到是可以就是只能获取到英文字符,如果是汉字就会乱码!知道可能是转码的问题,使用之前用过的代码也出现这样的问题!刚好看到php获取搜索关键 ...
html中搜索框提示语,JS实现搜索关键词的智能提示功能
最近在百度搜索的时候,当你输入一个字或者词的时候,他会给你们弹出一个下拉框出来,里面是和你相关的搜索提示比如我输入杨字,他会给我提示以下搜索提示我尝试着用JavaScript做了一个类似的练习, ...
pdf.js 请求传参关键词并高亮显示
pdf.js 请求传参关键词并高亮显示 1.去官网下载: http://mozilla.github.io/pdf.js/getting_started/#download 2.将下载的包copy到s ...

JS实现HTM搜索关键词高亮显示

一、程序案例代码

二、程序运行效果

JS实现HTM搜索关键词高亮显示相关推荐

最新文章

热门文章