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 Excel操作知识点
Apr 24 Javascript
javascript 设计模式之单体模式 面向对象学习基础
Apr 18 Javascript
JS判断页面加载状态以及添加遮罩和缓冲动画的代码
Oct 11 Javascript
javascript避免数字计算精度误差的方法详解
Mar 05 Javascript
checkbox勾选判断代码分析
Jun 11 Javascript
深入理解jQuery 事件处理
Jun 14 Javascript
微信小程序 视图容器组件的详解及实例代码
Jan 19 Javascript
Angular.js实现获取验证码倒计时60秒按钮的简单方法
Oct 18 Javascript
解决angular2 获取到的数据无法实时更新的问题
Aug 31 Javascript
JavaScript实现简单音乐播放器
Apr 17 Javascript
js实现多个标题吸顶效果
Jan 08 Javascript
手机浏览器唤起微信分享(JS)
Oct 11 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
PHP执行linux系统命令的常用函数使用说明
2010/04/27 PHP
PHP中使用数组指针函数操作数组示例
2014/11/19 PHP
php根据日期或时间戳获取星座信息和生肖等信息
2015/10/20 PHP
WordPress主题中添加文章列表页页码导航的PHP代码实例
2015/12/22 PHP
js cookies实现简单统计访问次数
2009/11/24 Javascript
通过javascript设置css属性的代码
2009/12/28 Javascript
ExtJS 刷新后如何默认选中刷新前最后一次选中的节点
2014/04/03 Javascript
JavaScript计划任务后台运行的方法
2015/12/18 Javascript
javascript面向对象程序设计高级特性经典教程(值得收藏)
2016/05/19 Javascript
jQuery 3.0中存在问题及解决办法
2016/07/15 Javascript
jQuery Validate 校验多个相同name的方法
2017/05/18 jQuery
php register_shutdown_function函数详解
2017/07/23 Javascript
利用纯js + transition动画实现移动端web轮播图详解
2017/09/10 Javascript
JavaScript插件Tab选项卡效果
2017/11/14 Javascript
vue一个页面实现音乐播放器的示例
2018/02/06 Javascript
js中DOM事件绑定分析
2018/03/18 Javascript
vue 表单输入格式化中文输入法异常问题
2018/05/30 Javascript
实例详解Vue项目使用eslint + prettier规范代码风格
2018/08/20 Javascript
详解NodeJS Https HSM双向认证实现
2019/03/12 NodeJs
基于vue-cli、elementUI的Vue超简单入门小例子(推荐)
2019/04/17 Javascript
微信小游戏之使用three.js 绘制一个旋转的三角形
2019/06/10 Javascript
通过实例解析javascript Date对象属性及方法
2020/11/04 Javascript
微信小程序实现简单购物车功能
2020/12/30 Javascript
[27:28]Ti4 冒泡赛第二天 iG vs NEWBEE 1
2014/07/15 DOTA
初步认识Python中的列表与位运算符
2015/10/12 Python
Python3多线程爬虫实例讲解代码
2018/01/05 Python
python实现电脑自动关机
2018/06/20 Python
Python机器学习工具scikit-learn的使用笔记
2021/01/28 Python
html5中嵌入视频自动播放的问题解决
2020/05/25 HTML / CSS
英国最受欢迎的手表网站:Watch Shop
2016/10/21 全球购物
瑞典快乐袜子:Happy Socks
2018/02/16 全球购物
银行学习十八大感想
2014/01/11 职场文书
学校安全教育制度
2014/01/31 职场文书
小学生环保标语
2014/06/13 职场文书
一次MySQL启动导致的事故实战记录
2021/09/15 MySQL
mysql性能优化以及配置连接参数设置
2022/05/06 MySQL