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 相关文章推荐
JS/jQuery实现默认显示部分文字点击按钮显示全部内容
May 13 Javascript
自定义的一个简单时尚js下拉选择框
Nov 20 Javascript
基于jquery的simpleValidate简易验证插件
Jan 31 Javascript
jQuery控制的不同方向的滑动(向左、向右滑动等)
Jul 18 Javascript
JS实现的5级联动Select下拉选择框实例
Aug 17 Javascript
jquery+css实现动感的图片切换效果
Nov 25 Javascript
ES6新特性八:async函数用法实例详解
Apr 21 Javascript
vue之父子组件间通信实例讲解(props、$ref、$emit)
May 22 Javascript
详解Node.js中path模块的resolve()和join()方法的区别
Oct 29 Javascript
vue 实现Web端的定位功能 获取经纬度
Aug 08 Javascript
如何通过shell脚本自动生成vue文件详解
Sep 10 Javascript
三剑客:offset、client和scroll还傻傻分不清?
Dec 04 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
星际争霸, 教主第一视角, ZvT经典龙蛇演义
2020/03/02 星际争霸
php数组冒泡排序算法实例
2016/05/06 PHP
Node.js插件的正确编写方式
2014/08/03 Javascript
Nodejs学习笔记之测试驱动
2015/04/16 NodeJs
详解JS正则replace的使用方法
2016/03/06 Javascript
Vue组件实例间的直接访问实现代码
2017/08/20 Javascript
JS Object.preventExtensions(),Object.seal()与Object.freeze()用法实例分析
2018/08/25 Javascript
Jquery和CSS实现选择框重置按钮功能
2018/11/08 jQuery
基于Vue-Cli 打包自动生成/抽离相关配置文件的实现方法
2018/12/09 Javascript
JS异步执行结果获取的3种解决方式
2019/02/19 Javascript
JavaScript中的ES6 Proxy的具体使用
2019/06/16 Javascript
如何测量vue应用运行时的性能
2019/06/21 Javascript
vue项目中常见问题及解决方案(推荐)
2019/10/21 Javascript
javascript设计模式 ? 单例模式原理与应用实例分析
2020/04/09 Javascript
详解JavaScript中的Object.is()与&quot;===&quot;运算符总结
2020/06/17 Javascript
Vue 中使用lodash对事件进行防抖和节流操作
2020/07/26 Javascript
[09:37]DOTA2卡尔工作室 英雄介绍圣堂刺客篇
2013/06/13 DOTA
使用python搭建Django应用程序步骤及版本冲突问题解决
2013/11/19 Python
详解Python3中ceil()函数用法
2019/02/19 Python
基于python求两个列表的并集.交集.差集
2020/02/10 Python
如何使用python的ctypes调用医保中心的dll动态库下载医保中心的账单
2020/05/24 Python
HTMl5的存储方式sessionStorage和localStorage详解
2014/03/18 HTML / CSS
详解HTML5 Canvas绘制时指定颜色与透明度的方法
2016/03/25 HTML / CSS
Lancer Skincare官方网站:抗衰老皮肤护理
2020/11/20 全球购物
一些.net面试题
2014/10/06 面试题
毕业生多媒体设计求职信
2013/10/12 职场文书
优秀学生自我鉴定范例
2013/12/18 职场文书
电大本科自我鉴定
2014/02/05 职场文书
环境科学专业教师求职信
2014/07/12 职场文书
农林经济管理专业自荐信
2014/09/01 职场文书
竞选大学学委演讲稿
2014/09/13 职场文书
2014年路政工作总结
2014/12/10 职场文书
环保建议书作文300字
2015/09/14 职场文书
银行文明优质服务培训心得体会
2016/01/09 职场文书
Nginx安装完成没有生成sbin目录的解决方法
2021/03/31 Servers
php 原生分页
2021/04/01 PHP