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 相关文章推荐
初学prototype,发个JS接受URL参数的代码
Sep 25 Javascript
JQUBAR1.1 jQuery 柱状图插件发布
Nov 28 Javascript
js 数据类型转换总结笔记
Jan 17 Javascript
jQuery新闻滚动插件 jquery.roller.js
Jun 27 Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
Nov 30 Javascript
getElementByIdx_x js自定义getElementById函数
Jan 24 Javascript
javascript 控制input只允许输入的各种指定内容
Jun 19 Javascript
JS取得绝对路径的实现代码
Jan 16 Javascript
JavaScript的Ext JS框架中的GridPanel组件使用指南
May 21 Javascript
作为老司机使用 React 总结的 11 个经验教训
Apr 08 Javascript
简化vuex的状态管理方案的方法
Jun 02 Javascript
详解Vue改变数组中对象的属性不重新渲染View的解决方案
Sep 21 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
微信支付PHP SDK之微信公众号支付代码详解
2015/12/09 PHP
PHP实现简单ajax Loading加载功能示例
2016/12/28 PHP
Google的跟踪代码 动态加载js代码方法应用
2012/11/12 Javascript
jquery mobile changepage的三种传参方法介绍
2013/09/13 Javascript
jquery.post用法之type设置问题
2014/02/24 Javascript
JavaScript对象之深度克隆介绍
2014/12/08 Javascript
《JavaScript DOM 编程艺术》读书笔记之DOM基础
2015/01/09 Javascript
js给网页加上背景音乐及选择音效的方法
2015/03/03 Javascript
jquery实现select选择框内容左右移动代码分享
2015/11/21 Javascript
分享jQuery网页元素拖拽插件
2020/12/01 Javascript
实现easyui的datagrid导出为excel的示例代码
2016/11/10 Javascript
vuejs事件中心管理组件间的通信详解
2017/08/09 Javascript
详解vue中点击空白处隐藏div的实现(用指令实现)
2018/04/19 Javascript
python实现迭代法求方程组的根过程解析
2019/11/25 Javascript
vue 验证两次输入的密码是否一致的方法示例
2020/09/29 Javascript
[01:22]DOTA2神秘商店携大量周边降临完美大师赛
2017/11/07 DOTA
python实现bitmap数据结构详解
2014/02/17 Python
python字典基本操作实例分析
2015/07/11 Python
Python写的一个定时重跑获取数据库数据
2016/12/28 Python
用python做一个搜索引擎(Pylucene)的实例代码
2017/07/05 Python
python使用筛选法计算小于给定数字的所有素数
2018/03/19 Python
Python学习_几种存取xls/xlsx文件的方法总结
2018/05/03 Python
Python实现使用卷积提取图片轮廓功能示例
2018/05/12 Python
Tensorflow 多线程设置方式
2020/02/06 Python
Python进程Multiprocessing模块原理解析
2020/02/28 Python
python 密码学示例——理解哈希(Hash)算法
2020/09/21 Python
python操作ini类型配置文件的实例教程
2020/10/30 Python
详解win10下pytorch-gpu安装以及CUDA详细安装过程
2021/01/28 Python
html5之Canvas路径绘图、坐标变换应用实例
2012/12/26 HTML / CSS
Furla官网:意大利著名的皮革品牌
2019/08/06 全球购物
如何判断一段程序是由C 编译程序还是由C++编译程序编译的
2013/08/04 面试题
护理实习自我鉴定
2013/12/14 职场文书
公司会议策划方案
2014/05/17 职场文书
三严三实对照检查材料
2014/09/22 职场文书
2015年高一班主任工作总结
2015/05/13 职场文书
美德少年主要事迹材料
2015/11/04 职场文书