/**
* @id 父节点id
* @key 关键字
*/
function keyLight(id, key, bgColor){
var oDiv = document.getElementById(id),
oChilds = oDiv.childNodes,
bgColor = bgColor || "orange",
sKey = "<b style='">";'>"+key+"</b>",
rStr = new RegExp(key, "g");
for(var i =0; i<oChilds.length-1; i++){
if(oChilds[i].nodeType == 3 && /\s/.test(oChilds[i].nodeValue)){ //删除空白的节点
oChilds[i].parentNode.removeChild(oChilds[i]);
}
oChilds[i].innerHTML = oChilds[i].innerHTML.replace(rStr,sKey); //替换key
}
}

html关键字高亮的更多相关文章

  1. IOS_SearchBar搜索栏及关键字高亮

    搜索框的效果演示: 这个就是所谓的搜索框了,那么接下来我们看看如何使用代码来实现这个功能. 我所使用的数据是英雄联盟的英雄名单,是一个JSON数据的txt文件, JSON数据的处理代码如下所示: ? ...

  2. 在 Angular 中实现搜索关键字高亮

    在 Angular 中,我们不应该试图直接修改 DOM 的内容,当需要更新 DOM 内容的时候,应该修改的其实是我们的数据模型,也就是 $scope 中的数据,Angular 会帮助我们将修改之后的数 ...

  3. C#,WPF中使用多文本显示数据,并对其数据进行关键字高亮等操作

    需求:针对多文本信息显示,我们需要对其内容中的某些关键字或者某行进行高亮显示,并用不同颜色显示. 分析:在C#中,首先要进行多文本信息显示,可以RichTextBox(不要使用TextBox)控件,该 ...

  4. 如何实现IOS_SearchBar搜索栏及关键字高亮

    搜索框的效果演示: 这个就是所谓的搜索框了,那么接下来我们看看如何使用代码来实现这个功能. 我所使用的数据是英雄联盟的英雄名单,是一个JSON数据的txt文件, JSON数据的处理代码如下所示: // ...

  5. JavaScript搜索关键字高亮的实现

    高亮功能主要是指对页面中指定区域的指定文字进行高亮显示,也就是背景着色.一般在搜索结果页面会经常用到这个功能. 下面就为大家提供一种解决方案,用javascript实现. 首先在<head> ...

  6. 简单JavaScript语句实现搜索关键字高亮功能

    高亮功能主要是指对页面中指定区域的指定文字进行高亮显示,也就是背景着色.一般在搜索结果页面会经常用到这个功能. 下面就为大家提供一种解决方案,用javascript实现. 首先在<head> ...

  7. qt关键字高亮

    qt的高亮显示主要是使用qsyntaxhighlighter类,由于qsyntaxhighlighter是抽象基类,所以需要继承并自己实现 //头文件 #ifndef MARKDOWN_HIGHLIG ...

  8. 【php+js】用PHP或者JS怎么显示搜索到的关键字高亮,及其文章里包含关键字的一小段

    1.想要实现的效果: 2.思路:小数据量使用 php的正则替换,即[preg_replace()]函数 -->> 支持多个关键词高亮显示,中间参数1和参数2放入对应的数组即可. $titl ...

  9. 设置Shader关键字高亮(网上转)

    原文链接:http://www.cnblogs.com/cg_ghost/archive/2011/11/30/2268734.html 经过试验,在VS2012有效. 1. 创建或编辑usertyp ...

  10. vi/vim 消除搜索后的关键字高亮

    使用vi或vim命令搜索某个关键字之后,取消高亮显示的方法 只要输入:noh即可

随机推荐

  1. Python-用装饰器实现递归剪枝

    求一个共有10个台阶的楼梯,从下走到上面,一次只能迈出1~3个台阶,并且不能后退,有多少中方法? 上台阶问题逻辑整理: 每次迈出都是 1~3 个台阶,剩下就是 7~9 个台阶 如果迈出1个台阶,需要求 ...

  2. Spring循环依赖的问题

      什么是循环依赖?就是两个Bean相互引用,比如用@Autowire 相互注入.   那么Spring是如何解决这个问题的呢?在Bean还未完全实例化前(类只实例化了一部分),将bean提前暴露出来 ...

  3. makefile实验三 理解make工作的基本原则

    代码简单,但测试花样多,若能回答对本博客的每个步骤的预期结果,可以说对makefile的基础掌握是扎实的. 一,当前的makefile代码 root@ubuntu:~/Makefile_Test# r ...

  4. P3378 堆(模板)

    P3378 [模板]堆 题目描述 给定一个数列,初始为空,请支持下面三种操作: 给定一个整数 x,请将 x 加入到数列中. 输出数列中最小的数. 删除数列中最小的数(如果有多个数最小,只删除 1 个) ...

  5. 【奇淫巧技】XSS绕过技巧

    XSS记录 1.首先是弹窗函数: alert(1) prompt(1) confirm(1)eval() 2.然后是字符的编码和浏览器的解析机制: 要讲编码绕过,首先我们要理解浏览器的解析过程,浏览器 ...

  6. 独立看第一个C++程序到最终结果log----2019-04-15

    本文纯为本人记录,有网上诸多参考,请勿转发! 记录可能可能有点啰嗦,自己划重点吧!! (无论是生活还是工作,如果很困惑,千万不要消极一定要勇敢积极的面对它,不用说太多懂得人自然懂,一定要解决这个疑惑就 ...

  7. 浙大《数据结构》学习&练习(一)算法初步

    1.数据结构是数据在计算机中的组织方式,类比图书在图书馆中的存储,应该如何分类,如何在书架上存取. 2.抽象数据结构是对一类的数据的一种组织方式的通用(抽象)描述,包括类型的名称,数据对象集和操作集. ...

  8. 【题解】Product

    \(\color{brown}{Link}\) \(\text{Solution:}\) \(Question:\) \(\prod_{i=1}^n \prod_{j=1}^n \frac{lcm(i ...

  9. Navicat连接MySQL报错-2059

    解释原因:据说,mysql8 之前的版本中加密规则是mysql_native_password,而在mysql8之后,加密规则是caching_sha2_password, 解决问题方法有两种,一种是 ...

  10. 第四届58topcoder编程大赛--地图路径规划

    layout: post title: 第四届58topcoder编程大赛 subtitle: 58ACM catalog: true tags: - A* 算法 - C++ - 程序设计 问题及背景 ...