javascript高亮效果的二种实现方法


Posted in Javascript onSeptember 14, 2008

js高亮方法一:

<script> 
function HighLight(nWord){ if(nWord!=''){ 
var keyword = document.body.createTextRange(); 
while(keyword.findText(nWord)){ 
keyword.pasteHTML("<span style='color:red;'>" + keyword.text + "</span>"); 
keyword.moveStart('character',1); 
} 
} 
} 
function highword(nWord){ 
var array = nWord.split(","); 
for(var i=0;i<array.length;i++){ 
HighLight(array[i]); 
} 
} 
</script> 

<body onload="highword('li,jin')"> 
<p>liujinzhong liujinzhong liuzhong</p> 
</body>

js高亮方法二:

2.

<html> 
<head> 
<title>Test Page</title> 
<script type="text/javascript"> 
<!-- 
function highLight(ele,keys) 
{ 
var reg = new RegExp("(" + keys.replace(/,/,"|") + ")","g"); ele.innerHTML = ele.innerHTML.replace(reg,"<font color=\"red\">$1</font>"); 
} 
window.onload = function() 
{ 
highLight(document.getElementsByTagName("p")[0],"li,jin"); 
} 
//--> 
</script> 
</head> 
<body> 
<p>liujinzhong liujinzhong liuzhong</p> 
</body> 
</html>
Javascript 相关文章推荐
自动生成文章摘要的代码[JavaScript 版本]
Mar 20 Javascript
JS根据变量保存方法名并执行方法示例
Apr 04 Javascript
jQuery时间插件jquery.clock.js用法实例(5个示例)
Jan 14 Javascript
Jquery针对tr td的一些实用操作方法(必看篇)
Oct 05 Javascript
Javascript 高性能之递归,迭代,查表法详解及实例
Jan 08 Javascript
JavaScript使用正则表达式获取全部分组内容的方法示例
Jan 17 Javascript
javascript设计模式之中介者模式学习笔记
Feb 15 Javascript
javascript 的变量、作用域和内存问题
Apr 19 Javascript
JavaScript代码判断输入的字符串是否含有特殊字符和表情代码实例
Aug 17 Javascript
Vue CLI3 如何支持less的方法示例
Aug 29 Javascript
Vue发布项目实例讲解
Jul 17 Javascript
使用Cargo工具高效创建Rust项目
Aug 14 Javascript
jquery 必填项判断表单是否为空的方法
Sep 14 #Javascript
js直接编辑当前cookie的脚本
Sep 14 #Javascript
javascript一些不错的函数脚本代码
Sep 10 #Javascript
利用Ext Js生成动态树实例代码
Sep 08 #Javascript
用JavaScrpt实现文件夹简单轻松加密的实现方法图文
Sep 08 #Javascript
Javascript条件判断使用小技巧总结
Sep 08 #Javascript
SyntaxHighlighter代码加色使用方法
Sep 07 #Javascript
You might like
PHP4实际应用经验篇(9)
2006/10/09 PHP
PHP的范围解析操作符(::)的含义分析说明
2011/07/03 PHP
PHP swfupload图片上传的实例代码
2013/09/30 PHP
smarty实现多级分类的方法
2014/12/05 PHP
JavaScipt基本教程之前言
2008/01/16 Javascript
Jquery ajax不能解析json对象,报Invalid JSON错误的原因和解决方法
2010/03/27 Javascript
基于datagrid框架的查询
2013/04/08 Javascript
alert和confirm功能介绍
2014/05/21 Javascript
js遍历子节点子元素附属性及方法
2014/08/19 Javascript
快速掌握Node.js中setTimeout和setInterval的使用方法
2016/03/21 Javascript
浅谈JavaScript 中有关时间对象的方法
2016/08/15 Javascript
浅谈jquery中使用canvas的问题
2016/10/10 Javascript
详解微信小程序开发—你期待的分享功能来了,微信小程序序新增5大功能
2016/12/23 Javascript
nodejs服务搭建教程 nodejs访问本地站点文件
2017/04/07 NodeJs
利用vue组件自定义v-model实现一个Tab组件方法示例
2017/12/06 Javascript
Vue shopCart 组件开发详解
2018/01/26 Javascript
JavaScript 继承 封装 多态实现及原理详解
2019/07/29 Javascript
layui实现图片虚拟路径上传,预览和删除的例子
2019/09/25 Javascript
JavaScript Canvas编写炫彩的网页时钟
2019/10/16 Javascript
vue-router之实现导航切换过渡动画效果
2019/10/31 Javascript
js实现视图和数据双向绑定的方法分析
2020/02/05 Javascript
JS中FormData类实现文件上传
2020/03/27 Javascript
vue实现div可拖动位置也可改变盒子大小的原理
2020/09/16 Javascript
介绍Python的@property装饰器的用法
2015/04/28 Python
python win32 简单操作方法
2017/05/25 Python
浅谈用Python实现一个大数据搜索引擎
2017/11/28 Python
Python 函数基础知识汇总
2018/03/09 Python
python3.6数独问题的解决
2019/01/21 Python
应届生骨科医生求职信
2013/10/31 职场文书
会计助理的岗位职责
2013/11/29 职场文书
学校师德师风整改方案
2014/10/28 职场文书
2015年清明节网上祭英烈活动总结
2015/03/26 职场文书
护士年终工作总结不会写?各科护士模板总结
2020/01/02 职场文书
python-opencv 中值滤波{cv2.medianBlur(src, ksize)}的用法
2021/06/05 Python
CSS中实现动画效果-附案例
2022/02/28 HTML / CSS
python实现学生信息管理系统(面向对象)
2022/06/05 Python