js正文内容高亮效果的实现方法


Posted in Javascript onJune 30, 2013
//高亮显示搜索到的关键字
function HeightLight(Keyword)
{
 //文本选择器
 var TextRange;
 //是否找到
 var Found=false;
 //找到的次数
 var Count = 0;
 TextRange = document.body.createTextRange();
 Found = TextRange.findText(Keyword);
 if (Found)
 {
  Count++;
 }
 while (Found && Count > 0)
 {
  TextRange.pasteHTML('<span style="background:yellow">' + Keyword + '</span>');
  //将滚动条定位到第一次查到的视口范围内
  if(Count==1)
  {
   TextRange.scrollIntoView();
  }
  //继续查找
  Found = TextRange.findText(Keyword);
  if (!Found)
  {
   Count = 0;
  }
  else
  {
   Count++;
  }
 }
}
//正则式法
function highLight(ele,keys) 
{ 
 var reg = new RegExp("(" + keys.replace(/,/,"|") + ")","g"); 
 ele.innerHTML = ele.innerHTML.replace(reg,"<font color=\"red\">$1</font>"); 
}
Javascript 相关文章推荐
JavaScript动态插入script的基本思路及实现函数
Nov 11 Javascript
jquery实现点击页面计算点击次数
Jan 23 Javascript
javascript实现下班倒计时效果的方法(可桌面通知)
Jul 10 Javascript
JS+CSS实现仿支付宝菜单选中效果代码
Sep 25 Javascript
JavaScript组件开发完整示例
Dec 15 Javascript
Bootstrap按钮下拉菜单组件详解
May 10 Javascript
AngularJS中比较两个数组是否相同
Aug 24 Javascript
纯js实现画一棵树的示例
Sep 05 Javascript
AngularJS实现的生成随机数与猜数字大小功能示例
Dec 25 Javascript
Vue 表情包输入组件的实现代码
Jan 21 Javascript
安装多版本Vue-CLI的实现方法
Mar 24 Javascript
JS 设计模式之:工厂模式定义与实现方法浅析
May 06 Javascript
Jquery网页出现的乱码问题的三种解决方法
Jun 30 #Javascript
JavaScript全排列的六种算法 具体实现
Jun 29 #Javascript
利用js 进行输入框自动匹配字符的小例子
Jun 29 #Javascript
JS Replace()的高级使用方法介绍
Jun 29 #Javascript
jQuery.extend()的实现方式详解及实例
Jun 29 #Javascript
JS 退出系统并跳转到登录界面的实现代码
Jun 29 #Javascript
JavaScript基础篇之变量作用域、传值、传址的简单介绍与实例
Jun 29 #Javascript
You might like
php递归创建和删除文件夹的代码小结
2012/04/13 PHP
PHP中使用sleep造成mysql读取失败的案例和解决方法
2014/08/21 PHP
php工具型代码之印章抠图
2018/07/18 PHP
php获取微信基础接口凭证Access_token
2018/08/23 PHP
深入理解JavaScript系列(2) 揭秘命名函数表达式
2012/01/15 Javascript
js获取网页高度(详细整理)
2012/12/28 Javascript
Egret引擎开发指南之编译项目
2014/09/03 Javascript
jQuery验证插件validate使用详解
2016/05/11 Javascript
Bootstrap学习笔记之css组件(3)
2016/06/07 Javascript
深入剖析JavaScript面向对象编程
2016/07/12 Javascript
关于js函数解释(包括内嵌,对象等)
2016/11/20 Javascript
浅谈js键盘事件全面控制
2016/12/01 Javascript
js操作浏览器的参数方法
2017/01/21 Javascript
AngularJS service之select下拉菜单效果
2017/07/28 Javascript
基于vue.js 2.x的虚拟滚动条的示例代码
2018/01/23 Javascript
vue 详情跳转至列表页实现列表页缓存
2019/03/27 Javascript
Node.js 实现远程桌面监控的方法步骤
2019/07/02 Javascript
js针对图片加载失败的处理方法分析
2019/08/24 Javascript
vue之组件内监控$store中定义变量的变化详解
2019/11/08 Javascript
解决antd 表单设置默认值initialValue后验证失效的问题
2020/11/02 Javascript
Python应用03 使用PyQT制作视频播放器实例
2016/12/07 Python
Python 存储字符串时节省空间的方法
2019/04/23 Python
pycharm 安装JPype的教程
2019/08/08 Python
Python脚本导出为exe程序的方法
2020/03/25 Python
tensorflow2.0的函数签名与图结构(推荐)
2020/04/28 Python
利用Vscode进行Python开发环境配置的步骤
2020/06/22 Python
HTML5 和小程序实现拍照图片旋转、压缩和上传功能
2018/10/08 HTML / CSS
Chi Chi London官网:购买连衣裙和礼服
2020/10/25 全球购物
企业文化标语口号
2014/06/09 职场文书
公证委托书
2014/08/01 职场文书
信访维稳承诺书
2015/05/04 职场文书
学校世界艾滋病日宣传活动总结
2015/05/05 职场文书
城南旧事电影观后感
2015/06/16 职场文书
工作态度怎么写
2015/06/25 职场文书
干货:企业内部人才推荐奖励方案!
2019/07/09 职场文书
JS中forEach()、map()、every()、some()和filter()的用法
2022/05/11 Javascript