网站首页 手机版
 注册 登录
您现在的位置: 畅无忧设计 >> 网站建设 >> Javascript >> 正文
最新文章
· Jquery插件原来就这么简单
· 21个值得收藏的Javascript技巧
· JavaScript中的原型和继承
· JS对select动态添加options操作
· js获取表单值的两种方法
· 关闭网页弹出加入收藏,刷新不弹出加
· 如何判断是关闭还是刷新网页
· 命名JavaSript函数名时注意
· javascript中的setAttribute()浏览器
· JS实现IE6下PNG图片透明且链接正常的
热门文章
 JS实现两个页面传值
 实现对文字自动排版的网页特效
 JS获取指定ID标签之间的内容
 JS实现IE6下PNG图片透明且链接正常
 JS计数器
 通过js改变页面中元素的内容
 js切换文本框的只读与可写的动态切
 JS实现cookie的添加、获取、删除
 js在线编辑器常用函数大全
 javascript中的setAttribute()浏览
相关文章
JavaScript实现搜索关键字高亮
实现文章中出现的关键字自动加亮加连接的
关键字加亮的JS方法
来源:blog.dsbao.com 更新时间:2009/12/1 0:59:29 阅读次数:
字体:[ ] 我要投稿

形如Google,Baidu的搜索关键字加亮,我比较了好几个,还是脚本之家的最好,javascript方法实现很简单,如果添加上面很炫,有需要的仁兄可以看看。

1、单个关键字加亮
代码:
<div id="txt">
用JS让文章内容指定的关键字加亮<br /><br />
是这样的..<br />
现在有这些关键字:美容,生活,购物<br />
当在文章里头出现这些关键字,就把它加亮显示..<br /><br />
文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现...<br />
不知道怎样来实现这样的功能啊?特此求助<br />
</div>
<script language="JavaScript">
txt.innerHTML = txt.innerHTML.replace(/文章/gi,"<font color=red>文章</font>");
</script>

2、多个关键字加亮
代码:
<div id="txt">
用JS让文章内容指定的关键字加亮<br /><br />
是这样的..<br />
现在有这些关键字:美容,生活,购物<br />
当在文章里头出现这些关键字,就把它加亮显示..<br /><br />
文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现...<br />
不知道怎样来实现这样的功能啊?特此求助<br />
</div>
<script language="JavaScript">
txt.innerHTML = txt.innerHTML.replace(/(文章)|(关键字)|(功能)/gi,"<font color=red>$1$2$3</font>");
</script>

字符 含义  
$$ $ (JScript 5.5 或更新版本)  
$& 指定与整个模式匹配的 stringObj 的部分。 (JScript 5.5 或更新版本)  
$` 指定由 $& 描述的匹配之前的 stringObj 部分。 (JScript 5.5 或更新版本)  
$' 指定由 $& 描述的匹配之后的 stringObj 部分。 (JScript 5.5 或更新版本)  
$n 捕获的第 n 个子匹配,此处 n 为从1到9的十进制一位数。 (JScript 5.5 或更新版本)  
$nn 捕获的第 nn 个子匹配,此处 nn 为从01到99的十进制两位数。 (JScript 5.5 或更新版本) 
g,全局模式匹配 
i,不区分大小写匹配

注:
1〉如果你需要通过传递参数来获得关键字,你只要适当调整代码就可以了。
2〉千万注意你样式里面含有相同的关键字的匹配,如关键字是“1”的时候,你的样式里面有height=1,这是就会出现错误,这些具体的错误,你们就要自己具体调试了。

  • 上一篇文章:
  • 下一篇文章:
  • 关于我们 - 联系我们 - 广告服务 - 在线投稿 - 友情链接 - 网站地图 - 版权声明
    CopyRight 2008-2010, CWYDESIGN.COM - 畅无忧设计, Inc. All Rights Reserved
    滇ICP备09005765号