jQuery过滤HTML标签并高亮显示关键字的方法


Posted in Javascript onAugust 07, 2015

本文实例讲述了jQuery过滤HTML标签并高亮显示关键字的方法。分享给大家供大家参考。具体如下:

jQuery实现网页关键字过滤效果,将需要过滤的文字定义在JavaScript中,可定义多个,不过要修改JS代码为数组,这样可过滤出多个不同的关键字,本例只是为你演示一个基本的功能,更多过滤功能请自己挖掘吧。

具体代码如下:

<script type="text/javascript" src="jquery-1.6.2.min.js"></script><script>
$(document).ready(function() {
  var keyword = "三水点靠木";
  $("#keyword").html(function() {
    return $(this).text().replace(keyword,"<font color=\"red\">"+keyword+"</font>");
  });
});
</script>
<div id="keyword">三水点靠木成立于2006年,至立于奉献开源的精品学习型源代码,如果你喜欢三水点靠木的话,请把我们网址加入收藏夹吧!</div>

希望本文所述对大家的jquery程序设计有所帮助。

Javascript 相关文章推荐
鼠标经过的文本框textbox变色
May 21 Javascript
Jquery 获取checkbox的checked问题
Nov 16 Javascript
利用jquery写的左右轮播图特效
Feb 12 Javascript
JS实现OCX控件的事件响应示例
Sep 17 Javascript
jquery插件推荐浏览器嗅探userAgent
Nov 09 Javascript
举例讲解jQuery对DOM元素的向上遍历、向下遍历和水平遍历
Jul 07 Javascript
基于KO+BootStrap+MVC实现的分页控件代码分享
Nov 07 Javascript
JS实现获取汉字首字母拼音、全拼音及混拼音的方法
Nov 14 Javascript
javascript中的replace函数(带注释demo)
Jan 07 Javascript
vue-cli结合Element-ui基于cropper.js封装vue实现图片裁剪组件功能
Mar 01 Javascript
Vue 后台管理类项目兼容IE9+的方法示例
Feb 20 Javascript
vue实现tab栏点击高亮效果
Aug 19 Javascript
jquery实现先淡出再折叠收起的动画效果
Aug 07 #Javascript
C++中的string类的用法小结
Aug 07 #Javascript
Grunt入门教程(自动任务运行器)
Aug 06 #Javascript
PhantomJS快速入门教程(服务器端的 JavaScript API 的 WebKit)
Aug 06 #Javascript
jQuery实现hover合成事件的方法
Aug 06 #Javascript
Ajax清除浏览器js、css、图片缓存的方法
Aug 06 #Javascript
jQuery实现动画效果circle实例
Aug 06 #Javascript
You might like
array_multisort实现PHP多维数组排序示例讲解
2011/01/04 PHP
PHP自定义函数判断是否为Get、Post及Ajax提交的方法
2017/07/27 PHP
Javascript学习笔记 delete运算符
2011/09/13 Javascript
如何使用Jquery获取Form表单中被选中的radio值
2013/08/09 Javascript
JS 如何获取radio选中后的值及不选择取radio的值
2013/10/28 Javascript
JS中实现replaceAll的方法(实例代码)
2013/11/12 Javascript
使用jquery实现IE下按backspace相当于返回操作
2014/03/18 Javascript
jQuery中height()方法用法实例
2014/12/24 Javascript
jquery实现手机号码选号的方法
2015/07/31 Javascript
详解js中class的多种函数封装方法
2016/01/03 Javascript
js获取iframe中的window对象的实现方法
2016/05/20 Javascript
jQuery DataTables插件自定义Ajax分页实例解析
2020/04/28 Javascript
bootstrap实现动态进度条效果
2017/03/08 Javascript
详解Vue中过度动画效果应用
2017/05/25 Javascript
Vue 样式绑定的实现方法
2019/01/15 Javascript
js/jQuery实现全选效果
2019/06/17 jQuery
Centos7 安装Node.js10以上版本的方法步骤
2019/10/15 Javascript
功能完善的小程序日历组件的实现
2020/03/31 Javascript
js实现数据导出为EXCEL(支持大量数据导出)
2020/03/31 Javascript
解决vue项目 build之后资源文件找不到的问题
2020/09/12 Javascript
Python的Tornado框架的异步任务与AsyncHTTPClient
2016/06/27 Python
python 求某条线上特定x值或y值的点坐标方法
2019/07/09 Python
150行python代码实现贪吃蛇游戏
2020/04/24 Python
Python logging自定义字段输出及打印颜色
2020/11/30 Python
佳能英国官方网站:Canon UK
2017/08/08 全球购物
大学毕业寄语大全
2014/04/10 职场文书
不听老师话的万能检讨书
2014/10/04 职场文书
2014购房个人委托书范本
2014/10/12 职场文书
《爱的教育》读书心得
2014/11/08 职场文书
公务员政审材料范文
2014/12/23 职场文书
财务个人年度总结范文
2015/02/26 职场文书
2015年高校保卫处工作总结
2015/07/23 职场文书
初一年级组工作总结
2015/08/12 职场文书
使用Canvas绘制一个游戏人物属性图
2022/03/25 Javascript
《地。-关于地球的运动-》单行本第七集上市,小说家朝井辽献上期待又害怕的推荐文
2022/03/31 日漫
Python安装及建立虚拟环境的完整步骤
2022/06/25 Servers