时间:2016-02-17 22:05 来源: 我爱IT技术网 作者:佚名
欢迎您访问我爱IT技术网，今天小编为你分享的javascript教程：【Google AJAX 搜索 API实现代码】，下面是详细的讲解！
Google AJAX 搜索 API实现代码
<!DOCTYPE html>
<html>
<head>
<title>Google AJAX 搜索 API</title>
<style type="text/css">
#searchcontrol .gsc-control
{
width: 100%;
}
#searchcontrol .gsc-result-cnblogs .gs-title
{
color:Red;
}
</style>
<script src="https://www.google.com/jsapi?key=ABQIAAAAWUT8aaIj9mtqQa087LjVOhTPB5B7LRDljl2Cr4-
JwBNft1mFrRRmR1RoYEUCZCj0dtS2gIc8Al4-VA"
type="text/javascript"></script>
<script language="Javascript" type="text/javascript">
google.load("search", "1");
function OnLoad() {
//搜索设置
var options=new google.search.SearcherOptions();
//当搜索结果为空时显示内容
options.setNoResultsString('查询结果为空！');
//搜索控件实例化
var searchControl=new google.search.SearchControl();
//每次显示8个搜索结果（取值范围：1-8）
searchControl.setResultSetSize(8);
//网页搜索
var siteCnblogs=new google.search.WebSearch();
//标头
siteCnblogs.setUserDefinedLabel("我爱IT技术网");
//样式后缀名
siteCnblogs.setUserDefinedClassSuffix("jb51");
//站点限制
siteCnblogs.setSiteRestriction("jb51.net");
searchControl.addSearcher(siteCnblogs, options);
//局部搜索
var siteZjfree=new google.search.WebSearch();
siteZjfree.setUserDefinedLabel("素材搜索");
siteZjfree.setSiteRestriction("sc.jb51.net");
searchControl.addSearcher(siteZjfree, options);
//全网搜索
searchControl.addSearcher(new google.search.WebSearch(), options);
//添加博客搜索
searchControl.addSearcher(new google.search.BlogSearch(), options);
//添加视频搜索
searchControl.addSearcher(new google.search.VideoSearch(), options);
//添加新闻搜索
searchControl.addSearcher(new google.search.NewsSearch(), options);
//添加图片搜索
searchControl.addSearcher(new google.search.ImageSearch(), options);
//添加本地地图搜索
var localSearch=new google.search.LocalSearch();
//地图中心标记 测试时可使用“大雁塔”
localSearch.setCenterPoint("西安,钟楼");
searchControl.addSearcher(localSearch, options);
//绘制搜索
var drawOptions=new google.search.DrawOptions();
drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);
searchControl.draw(document.getElementById("searchcontrol"), drawOptions);
//执行搜索查询
searchControl.execute("google api");
}
//框架加载完成后调用
google.setOnLoadCallback(OnLoad);
</script>
</head>
<body>
<div id="searchcontrol">
加载中...
</div>
</body>
</html>
关于Google AJAX 搜索 API实现代码的用户互动如下：
相关问题：Google网页搜索API如何用？
答：教程 http://www.codechina.org/doc/google/gmapapi/ 地址 http://code.google.com/intl/zh-CN/apis/maps/ 教程 http://www.codechina.org/doc/google/gmapapi/ 什么是 Google 地图 API？ Google 地图 API 使您能够使用 JavaScript 将 Google 地... >>详细
相关问题：怎么建立一个可以基于google api 搜索的网站，可以...
答：站内搜索和站外搜索吗，google api里有这个功能，调函数就行了，要申请站内搜索。或者自己写个蜘蛛对内搜索。 >>详细
相关问题：html编程 我用dw cs6设计写了一个Google首页，如何...
答：单用html的话，这是不可能的…… 你要的是自动匹配进行下拉提示的话， 概括来说，就是用户输入文字，然后用ajax与后台服务器交互，查询数据库，得到匹配项，然后返回到页面，更新页面的下拉列表。（只要这个显示效果的话，倒是简单的多了，不过不... >>详细
- 【firefox】firefox浏览器不支持innerText的解决
- 【Extjs】Extjs学习过程中新手容易碰到的低级错误
- 【clearInterval】js clearInterval()方法的定义
- 【ComboBox】ComboBox 和 DateField 在IE下消失的
- 【ajax】用js来解决ajax读取页面乱码-页面乱码
- 【dom】javascript dom追加内容实现示例-追加内容
- 【has】基于jquery的has()方法以及与find()方法以
- 【extjs】Extjs入门之动态加载树代码-动态加载树
- 【checkbox】让checkbox不选中即将选中的checkbox
- 【angularjs_scope】AngularJS中监视Scope变量以
- 评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
-