鸟食轩

 Microsoft .NET[C#] MVP 2003
随笔 - 424, 文章 - 233, 评论 - 5418, 引用 - 344
数据加载中……

利用搜索引擎引用来高亮页面关键字

    当我们在使用大多数的网页搜索引擎的"网页快照"功能时，他们都会在返回的快照页面中加入关键字高亮的功能。这将非常方便我们查找网页中被检索的内容，其中google快照的关键字高亮还融入了分词功能，不同的词着以不同的颜色。可是由于%!#^*&$!的原因，google的网页快照非常的不稳定，那么我们就自己来加上这个关键字高亮功能吧。

    如下图，当我们在google中搜索了关键字：apache asp.net后的结果：
   GoogleResult.png

    点击结果的连接并导航到我们自己的页面后，如果我们加以如下关键字高亮，是否会对用户快速查找和定位页面感兴趣的内容，提供方便呢？
    HighlightText.gif
    
    按么我们来仔细的看看，可是IE中的地址明明是：http://birdshome.cnblogs.com/archive/2005/11/17/Apache.html，那么怎么能在页面中高亮由搜索引擎检索的关键字呢？这里我们是利用了document的referrer属性来获取搜索引擎类型和关键字信息的。比如上例中，document.referrer属性就为：http://www.google.com/search?hl=zh-CN&newwindow=1&q=apache+asp.net&btnG=%E6%90%9C%E7%B4%A2&lr=lang_zh-CN%7Clang_zh-TW。我们通过JavaScript分析出指定搜索引擎的关键字，再操作页面DOM对象就实现了高亮的功能。不过对于较长的连续中文关键字，这种客户端高亮方案是不可能提供分词功能的，也算是美中不足了。

    具体实现当前页面被检索关键字高亮的代码如下，放入页面的document.body.onload事件中调用就行了:)
function FriendlyDisplayForSearch()
{
    var url = new UrlBuilder(document.referrer);
    if ( url.m_Success )
    {
         var host = url.m_Host.toLowerCase();
         if ( host.indexOf('.google.') != -1 )
         {
             var keywords = url.GetValue('q', 'UTF8');
             if ( keywords )
             {
                  var ht = new HighlightText();
                  ht.Execute(keywords);
             }
         }
         else if ( host.indexOf('.baidu.') != -1 )
         {
        
         }    
    }   
}
// 由于编码和使用频率的关系，目前只做了google搜索引擎

function HighlightText(range)


HighlightText.prototype.Execute = function(keyword)

    其它参考：UrlBuilder
    相关文章：
        ·注入Script增加了一个GoogleTrack功能
        ·用脚本为本blog增加了几项自定义功能

posted on 2006-02-23 00:32 birdshome 阅读(4162) 评论(18)  编辑 收藏 所属分类: Jscript&Dhtml开发

评论

#1楼    回复  引用    

好文章！不过网页无法保存成mht

T_T
2006-02-23 08:29 | 7033 [未注册用户]

#2楼    回复  引用  查看    

正是前段时间我所搞的东东。
2006-02-23 08:32 | HD      

#3楼    回复  引用  查看    

birdshome兄还是保持一贯以来的胡思乱想并努力钻研精神啊，呵呵
2006-02-23 09:35 | THIN      

#4楼    回复  引用    

请教一下HighlightText.prototype.Execute = function(keyword)
这句语法是怎么解释？
谢
2006-02-23 09:46 | guest [未注册用户]

#5楼 [楼主]   回复  引用  查看    

@guest
http://www.javascriptkit.com/javatutors/proto.shtml
2006-02-23 10:20 | birdshome      

#6楼    回复  引用    

function(keyword) 应该是个匿名方法，里面的参数如何传递进去，从而对属性赋值？我是脚本白痴。
2006-02-23 10:43 | guest [未注册用户]

#7楼    回复  引用  查看    

晕HighlightText.prototype.Execute = function(keyword)是利用prototype为HightlightText定义方法Execute，它传入一个参数keyword
2006-02-23 10:54 | THIN      

#8楼    回复  引用  查看    

牛
2006-02-23 22:41 | 川仔      

#9楼    回复  引用  查看    

Cool!

不过我是来抱怨为什么我的Google快照从来不能用的，呵呵……
2006-02-25 18:38 | 蜡人张      

#10楼 [楼主]   回复  引用  查看    

@蜡人张
不是我干的。。。
2006-02-25 21:20 | birdshome      

#11楼    回复  引用    

Cool!
2006-02-25 23:36 | Cool! [未注册用户]

#12楼    回复  引用    

晕..
2006-02-26 00:13 | Cool! [未注册用户]

#13楼    回复  引用    

Cool! !
2006-02-26 16:52 | Yng [未注册用户]

#14楼    回复  引用    

如果用regex呢
2006-04-05 23:07 | bundgrid [未注册用户]

#15楼    回复  引用    

能否在搜到的pdf中实现高亮显示吗?
2006-12-29 22:25 | 66[匿名] [未注册用户]

#16楼    回复  引用  查看    

very good
2007-08-03 11:04 | 古代      

标题  
姓名  
主页
Email (博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
网站首页

新闻频道

社区

小组

博问

网摘

闪存

找找看
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
该文被作者在 2006-02-23 10:07 编辑过
"五向定位"职业成长路线公开课(上海、南京、大连)
Google站内搜索


相关链接:


最新IT新闻:
Google Android手机大受欢迎,已经订出150万台
13个大文件邮件传送服务
微型博客Twitter取消IM服务 称其ROI差
用手机聊Gtalk的方法以及应用总结
Google开拓美政府机构市场 微软业务受冲击