免费注册 查看新帖 |

Chinaunix

  平台 论坛 博客 文库
最近访问板块 发新帖
查看: 2511 | 回复: 1
打印 上一主题 下一主题

[求助]javascript实现关键字高亮 [复制链接]

论坛徽章:
0
跳转到指定楼层
1 [收藏(0)] [报告]
发表于 2006-11-18 13:37 |只看该作者 |倒序浏览
function SearchHighlight(mytag) {
if (!document.createElement)
{
return;
}
var q = "{{$q}}";//要高亮显示的关键字
var l = document.getElementsByTagName(mytag);
if("" == q) return;
words = unescape(q.replace(/+/g,' ')).split(/s+/);
for (w=0;w<words.length;w++) {
for(i=0;i<l.length;i++)
{
var pa = new RegExp("("+words[w]+")","ig");
if(l.parentNode.parentNode.parentNode.id != "header")//标题中的内容不替换
l.innerHTML = l.innerHTML.replace(pa,"<span class="searchword">$1</span>");
}
}
}
别看代码不多,其中使用了正则及其向后引用等高级技术,实现了关键字高亮的巨大功能。调用方法:
document.onload = SearchHighlight(”a”);//要搜索的标签名称,这里的意思是凡是形如<a></a>的标记中的内容,包含关键字的时候均高亮显示。然后把下面的CSS定义加到你的CSS文件里或者直接加到HTML文件中
.searchword{background-color:yellow;}
那么所有的关键字(不论大小写)将显示为黄色背景。



请教如何写到HTML中
并实现高亮
比如1.htm有如下文字,如何才能做到关键字"CSS"高亮


别看代码不多,其中使用了正则及其向后引用等高级技术,实现了关键字高亮的巨大功能。调用方法:
document.onload = SearchHighlight(”a”);//要搜索的标签名称,这里的意思是凡是形如<a></a>的标记中的内容,包含关键字的时候均高亮显示。然后把下面的CSS定义加到你的CSS文件里或者直接加到HTML文件中
.searchword{background-color:yellow;}
那么所有的关键字(不论大小写)将显示为黄色背景。

[ 本帖最后由 七月十五 于 2006-11-18 13:39 编辑 ]

论坛徽章:
1
技术图书徽章
日期:2013-12-05 23:25:45
2 [报告]
发表于 2006-11-24 13:49 |只看该作者

  1. <p>test jandy ....... key fdkjslkfdjslkf</p>
  2. <p></p>
  3. <script>
  4.         function elm(tag){
  5.                 return document.getElementsByTagName(tag);
  6.         }
  7.         var find = elm("P")[0].innerHTML;

  8.         elm("P")[1].innerHTML = find.replace(/(key)/ig,"<strong style='color:red'>$1</strong>");
  9. </script>
复制代码


依此类推。
您需要登录后才可以回帖 登录 | 注册

本版积分规则 发表回复

  

北京盛拓优讯信息技术有限公司. 版权所有 京ICP备16024965号-6 北京市公安局海淀分局网监中心备案编号:11010802020122 niuxiaotong@pcpop.com 17352615567
未成年举报专区
中国互联网协会会员  联系我们:huangweiwei@itpub.net
感谢所有关心和支持过ChinaUnix的朋友们 转载本站内容请注明原作者名及出处

清除 Cookies - ChinaUnix - Archiver - WAP - TOP