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自动显示最后更新时间
Mar 15 Javascript
小议javascript 设计模式 推荐
Oct 28 Javascript
5个javascript的数字格式化函数分享
Dec 07 Javascript
JavaScript/jQuery 表单美化插件小结
Feb 14 Javascript
js保留小数点后几位的写法
Jan 03 Javascript
js控制再次点击按钮之间的间隔时间可防止重复提交
Aug 01 Javascript
jquery中$(#form :input)与$(#form input)的区别
Aug 18 Javascript
优化Node.js Web应用运行速度的10个技巧
Sep 03 Javascript
深入理解javascript作用域第二篇之词法作用域和动态作用域
Jul 24 Javascript
JS计算距当前时间的时间差实例
Dec 29 Javascript
node.js中ws模块创建服务端和客户端,网页WebSocket客户端
Mar 06 Javascript
Javascript使用integrity属性进行安全验证
Nov 07 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
使用 MySQL 开始 PHP 会话
2006/12/21 PHP
phpMyAdmin下载、安装和使用入门教程
2007/05/31 PHP
php中强制下载文件的代码(解决了IE下中文文件名乱码问题)
2011/05/09 PHP
PHP图片验证码制作实现分享(全)
2012/05/10 PHP
php实例分享之二维数组排序
2014/05/15 PHP
PHP中预定义的6种接口介绍
2015/05/12 PHP
gearman中worker常驻后台,导致MySQL server has gone away的解决方法
2020/02/27 PHP
ExtJS中文乱码之GBK格式编码解决方案及代码
2013/01/20 Javascript
比例尺、缩略图、平移缩放之百度地图添加控件方法
2015/08/03 Javascript
JS实现状态栏跑马灯文字效果代码
2015/10/24 Javascript
javascript中select下拉框的用法总结
2016/01/07 Javascript
jQuery向父辈遍历的简单方法
2016/09/18 Javascript
jqGrid翻页时数据选中丢失问题的解决办法
2017/02/13 Javascript
React学习笔记之条件渲染(一)
2017/07/02 Javascript
JS滚动到指定位置导航栏固定顶部
2017/07/03 Javascript
vue-cli脚手架config目录下index.js配置文件的方法
2018/03/13 Javascript
对angularJs中自定义指令replace的属性详解
2018/10/09 Javascript
js数组去重的方法总结
2019/01/18 Javascript
微信小程序实现简单表格
2019/02/14 Javascript
如何获取vue单文件自身源码路径
2019/05/06 Javascript
Ant Design Pro 下实现文件下载的实现代码
2019/12/03 Javascript
javascript设计模式 ? 中介者模式原理与用法实例分析
2020/04/20 Javascript
Vue如何将页面导出成PDF文件
2020/08/17 Javascript
Vue使用路由钩子拦截器beforeEach和afterEach监听路由
2020/11/16 Javascript
Python实现向QQ群成员自动发邮件的方法
2014/11/19 Python
Python基于pygame实现的font游戏字体(附源码)
2015/11/11 Python
numpy实现神经网络反向传播算法的步骤
2019/12/24 Python
欧洲最大的拼图游戏商店:JigsawPuzzle.co.uk
2018/07/04 全球购物
瑞士网球商店:Tennis-Point
2020/03/12 全球购物
工作人员思想汇报
2014/01/09 职场文书
父亲八十大寿答谢词
2014/01/23 职场文书
函授本科自我鉴定
2014/02/04 职场文书
运动会跳远加油稿
2014/02/20 职场文书
作弊检讨书范文
2015/05/06 职场文书
大学生村官入党自传
2015/06/26 职场文书
分析并发编程之LongAdder原理
2021/06/29 Java/Android