javascript 多种搜索引擎集成的页面实现代码


Posted in Javascript onJanuary 02, 2010

- 输入一个关键词,鼠标点击后面的搜索引擎链接,即可进入到该引擎的页面
- 如果输入关键词后敲回车,则使用默认搜索引擎,而每选择新的搜索引擎,默认引擎也会随之改变
- 自动记忆上次使用的搜索引擎,后面添加*
javascript 多种搜索引擎集成的页面实现代码
源代码如下,使用了多种IE/FF的适应办法:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<style type="text/css"> 
<!-- 
.normal {font-family: "Verdana","Arial";font-size:14px} 
.small {font-family: "Verdana","Arial";font-size:12px} 
body { font-family: "Verdana","Arial";font-size:14px} 
td {font-family: "Verdana","Arial";font-size:14px} 
th {font-family: "Verdana","Arial";font-size:15px} 
input {font-family: "Verdana","Arial";font-size:14px} 
a {text-decoration:underline; color:blue} 
a:link { text-decoration:underline; color: blue } 
a:visited { text-decoration:underline; color: blue } 
a:hover { text-decoration: underline; color: red } 
--> 
</style> 
<title>My Portal</title> 
<script language="javascript"> 
// 这一段使得FireFox也支持IE的innerText方法 
function isIE(){ 
if (window.navigator.userAgent.toLowerCase().indexOf("msie")>=1) 
return true; 
else 
return false; 
} 
if(!isIE()){ //firefox innerText define 
HTMLElement.prototype.__defineGetter__( "innerText", 
function(){ 
var anyString = ""; 
var childS = this.childNodes; 
for(var i=0; i <childS.length; i++) { 
if(childS[i].nodeType==1) 
anyString += childS[i].tagName=="BR" ? '\n' : childS[i].innerText; 
else if(childS[i].nodeType==3) 
anyString += childS[i].nodeValue; 
} 
return anyString; 
} 
); 
HTMLElement.prototype.__defineSetter__( "innerText", 
function(sText){ 
this.textContent=sText; 
} 
); 
} 
// 这一段使得FireFox的HTMLElement具有click方法(add click method to HTMLElement in Mozilla) 
try { 
// create span element so that HTMLElement is accessible 
document.createElement('span'); 
HTMLElement.prototype.click = function () { 
if (typeof this.onclick == 'function') 
this.onclick({type: 'click'}); 
}; 
} 
catch (e) { 
// alert('click method for HTMLElement couldn\'t be added'); 
} 
// 对HTMLAnchorElement 加入onclick事件 
try { 
// create a element so that HTMLAnchorElement is accessible 
document.createElement('a'); 
HTMLElement.prototype.click = function () { 
if (typeof this.onclick == 'function') { 
if (this.onclick({type: 'click'}) && this.href) 
window.open(this.href, this.target? this.target : '_self'); 
} 
else if (this.href) 
window.open(this.href, this.target? this.target : '_self'); 
}; 
} 
catch (e) { 
// alert('click method for HTMLAnchorElement couldn\'t be added'); 
} 
// 跟踪回车键事件 
function captureKeys (evt) { 
var keyCode = evt.keyCode ? evt.keyCode : 
evt.charCode ? evt.charCode : evt.which; 
if (keyCode == 13) { 
// cancel key: 
if (evt.preventDefault) { 
evt.preventDefault(); 
} 
var dq = getCookie('default-engine'); 
if( dq == null) dq = "baidu_txt"; 
submit_query( dq ); 
return false; 
} 
return true; 
} 
// cookie 功能函数 
function getCookie(cookieName) 
{ 
var cookieString = document.cookie; 
var start =cookieString.indexOf(cookieName+'='); 
if(start == -1) 
return null; 
start += cookieName.length + 1; 
var end = cookieString.indexOf(';', start); 
if(end == -1) 
return unescape(cookieString.substring(start)); 
return unescape(cookieString.substring(start,end)); 
} 
function setCookie(cookieName, cookieValue) 
{ 
var expires = new Date(); 
expires.setTime( expires.getTime() + 3*30*24*60*60*1000); // 3 months 
document.cookie = cookieName + '=' + escape(cookieValue)+';expires='+expires.toGMTString(); 
} 
function removeCookie(cookieName) 
{ 
var expires = new Date(); 
expires.setTime( expires.getTime() - 1); 
document.cookie = cookieName + '=fooxxx;expires='+expires.toGMTString(); 
} 
function $(id) { 
return document.getElementById(id); 
} 
// 调式Object用,适用于IE,Firefox下可用firebug 
function dumpObject(obj) 
{ 
var temp=""; 
for (x in obj) 
temp += x + ": " + obj[x] + "\n"; 
var popup = window.createPopup(); 
popup.document.body.innerHTML = '<textarea rows=30 cols=40>' + temp + '</textarea>'; 
popup.show(100, 100, 300, 400, document.body); 
} 
// 多种查询引擎请求分派 
function submit_query(t_query) 
{ 
var keyword = document.getElementById("keyword"); 
var mylink = document.getElementById("mylink"); 
var loc = ""; 
switch(t_query) 
{ 
case "baidu_txt": 
loc = "http://www.baidu.com/s?wd=" + keyword.value; 
break; 
case "baidu_img": 
loc = "http://image.baidu.com/i?ct=201326592&lm=-1&tn=baiduimagenojs&pv=&word=" + keyword.value + "&z=0&pn=0&rn=16&cl=2"; 
break; 
case "yodao_txt": 
loc = "http://www.yodao.com/search?q=" + encodeURI(keyword.value) + "&ue=utf8&keyfrom=web.index"; 
break; 
case "yodao_img": 
loc = "http://image.yodao.com/search?q=" + encodeURI(keyword.value) + "&ue=utf8&keyfrom=image.index"; 
break; 
case "yodao_dict": 
loc = "http://dict.yodao.com/search?q=" + encodeURI(keyword.value) + "&ue=utf8&keyfrom=dict.index"; 
break; 
case "yodao_blog": 
loc = "http://blog.yodao.com/search?q=" + encodeURI(keyword.value) + "&ue=utf8&keyfrom=blog.top"; 
break; 
case "iask_ditu": 
loc = "http://ditu.iask.com/a/r.php?cl=北京&key=" + keyword.value; 
break; 
case "verycd": 
loc = "http://www.verycd.com/search/folders/" + encodeURI(keyword.value); 
break; 
case "google_txt": 
loc = encodeURI("http://www.google.com/search?hl=en&q=" + keyword.value +"&btnG=Google+Search"); 
break; 
case "yahoo_txt": 
loc = "http://search.yahoo.com/search?p="+encodeURI(keyword.value)+"&vc=&fr=yfp-t-501&toggle=1&cop=mss&ei=UTF-8&fp_ip=CN"; 
break; 
case "trans_en": 
loc = "http://209.85.171.104/translate_c?hl=en&sl=en&tl=zh-CN&u=http://" + keyword.value + "/&usg=ALkJrhijPevZUxPtrHDj94k1U9Wo8x7S8g"; 
break; 
case "google_code": 
loc = "http://www.google.com/codesearch?q=" + keyword.value + "&hl=en&btnG=Search+Code"; 
break; 
case "google_scholar": 
loc = "http://scholar.google.com/scholar?q=" + keyword.value + "&hl=en&lr=&btnG=Search"; 
break; 
} 
setEngine(t_query); 
setCookie('default-engine', t_query); 
mylink.href= loc; 
mylink.click(); 
} 
function getDefaultEngine() 
{ 
var dq = getCookie('default-engine'); 
if( dq == null) dq = "baidu_txt"; 
return dq; 
} 
function setDefaultEngine() 
{ 
var old_e = getDefaultEngine(); 
if( $(old_e).innerText.indexOf('*') < 0) 
$(old_e).innerText = $(old_e).innerText + '*'; 
} 
function setEngine( new_e ) 
{ 
var old_e = getDefaultEngine(); 
if( $(old_e).innerText.indexOf('*') >= 0) 
$(old_e).innerText = $(old_e).innerText.replace('*',''); 
if( $(new_e).innerText.indexOf('*') < 0) 
$(new_e).innerText = $(new_e).innerText + '*'; 
setCookie('default-engine', new_e); 
} 
</script> 
</head> 
<body onload='setDefaultEngine()'> 
<table border="0" width="100%"> 
<tr><td> 
<a href="http://www.google.com" id="mylink" target="_blank">Search:</a> 
<input type="text" name="keyword" size="20" id="keyword" onkeypress="return captureKeys(event);"> 
<a href="#" id='baidu_txt' onclick="submit_query('baidu_txt')">百度</a>  
<a href="#" id='google_txt' onclick="submit_query('google_txt')">Google</a>  
<a href="#" id='yodao_txt' onclick="submit_query('yodao_txt')">有道</a>  
<a href="#" id='yodao_blog' onclick="submit_query('yodao_blog')">博客</a>  
<a href="#" id='google_code' onclick="submit_query('google_code')">代码</a>  
<a href="#" id='google_scholar' onclick="submit_query('google_scholar')">论文</a>  
<a href="#" id='baidu_img' onclick="submit_query('baidu_img')">百图</a>  
<a href="#" id='yodao_img' onclick="submit_query('yodao_img')">有图</a>  
<a href="#" id='yodao_dict' onclick="submit_query('yodao_dict')">词典</a>  
<a href="#" id='iask_ditu' onclick="submit_query('iask_ditu')">地图</a>  
<a href="#" id='verycd' onclick="submit_query('verycd')">CD</a>  
<a href="#" id='yahoo_txt' onclick="submit_query('yahoo_txt')">Yahoo</a>  
<a href="#" id='trans_en' onclick="submit_query('trans_en')">翻译</a>  
</td></tr> 
</table> 
</body> 
</html>
Javascript 相关文章推荐
深入聊聊Array的sort方法的使用技巧.详细点评protype.js中的sortBy方法
Apr 12 Javascript
jQuery checkbox全选/取消全选实现代码
Nov 14 Javascript
jQuery获取Select选择的Text和Value(详细汇总)
Jan 25 Javascript
javascript学习笔记(三)BOM和DOM详解
Sep 30 Javascript
用Move.js配合创建CSS3动画的入门指引
Jul 22 Javascript
javascript中Date format(js日期格式化)方法小结
Dec 17 Javascript
jQuery实现自动输入email、时间和域名的方法
Aug 24 Javascript
JS实现iframe自适应高度的方法示例
Jan 07 Javascript
vue2.0实战之使用vue-cli搭建项目(2)
Mar 27 Javascript
javascript 判断一个对象为数组的方法
May 03 Javascript
详解vue-cli项目中怎么使用mock数据
May 29 Javascript
JS前端使用canvas实现物体的点选示例
Aug 05 Javascript
让firefox支持IE的一些方法的javascript扩展函数代码
Jan 02 #Javascript
javascript getElementsByClassName 和js取地址栏参数
Jan 02 #Javascript
firefox插件Firebug的使用教程
Jan 02 #Javascript
firefox firebug中文入门教程 脚本之家新年特别版
Jan 02 #Javascript
Firefox+FireBug使JQuery的学习更加轻松愉快
Jan 01 #Javascript
20个非常棒的Jquery实用工具 国外文章
Jan 01 #Javascript
JavaScript与DropDownList 区别分析
Jan 01 #Javascript
You might like
NOT NULL 和NULL
2007/01/15 PHP
php用数组返回无限分类的列表数据的代码
2010/08/08 PHP
WIN8.1下搭建PHP5.6环境
2015/04/29 PHP
自定义jQuery选项卡插件实例
2013/03/27 Javascript
JS中实现replaceAll的方法(实例代码)
2013/11/12 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
Jquery easyui 实现动态树
2015/11/17 Javascript
jQuery中事件与动画的总结分享
2016/05/24 Javascript
原生js实现可爱糖果数字时间特效
2016/12/30 Javascript
jquery+ajax实现省市区三级联动效果简单示例
2017/01/04 Javascript
node.js入门学习之url模块
2017/02/25 Javascript
vue 修改 data 数据问题并实时显示的方法
2018/08/27 Javascript
vue框架中props的typescript用法详解
2020/02/17 Javascript
js实现时间日期校验
2020/05/26 Javascript
Openlayers显示瓦片网格信息的方法
2020/09/28 Javascript
JavaScript实现网页计算器功能
2020/10/29 Javascript
[01:44]Ti10举办地公布
2019/08/25 DOTA
Python脚本在Appium库上对移动应用实现自动化测试
2015/04/17 Python
Python实现二叉树结构与进行二叉树遍历的方法详解
2016/05/24 Python
Python中的多行注释文档编写风格汇总
2016/06/16 Python
Python实现爬虫抓取与读写、追加到excel文件操作示例
2018/06/27 Python
对python多线程中互斥锁Threading.Lock的简单应用详解
2019/01/11 Python
python使用tkinter库实现五子棋游戏
2019/06/18 Python
django foreignkey(外键)的实现
2019/07/29 Python
opencv3/C++实现视频背景去除建模(BSM)
2019/12/11 Python
html5本地存储 localStorage操作使用详解
2016/09/20 HTML / CSS
英国最大的奢侈品零售网络商城:Flannels
2016/09/16 全球购物
《寓言两则》教学反思
2014/02/27 职场文书
授权委托书样本
2014/04/03 职场文书
秘书英文求职信
2014/04/16 职场文书
大学活动总结模板
2014/07/10 职场文书
民主评议政风行风整改方案
2014/09/17 职场文书
解除劳动合同协议书范本2014
2014/09/25 职场文书
学期个人工作总结
2015/02/13 职场文书
Python基础之字符串格式化详解
2021/04/21 Python
MySQL数字类型自增的坑
2021/05/07 MySQL