<html xmlns="http://www.w3.org/1999/xhtml"><br /> <head><br /> <title>Google AJAX Search API Sample--smallkonrad </title><br /> <mce:script src="http://www.google.com/jsapi" mce_src="http://www.google.com/jsapi"<br /> type="text/javascript"></mce:script><br /> <mce:script language="Javascript" type="text/javascript"><!--<br /> //要在網站中使用該搜尋 API，您需要添加 Google AJAX API 載入程式的網址 (http://www.google.com/jsapi)<br /> //該庫允許您通過 google.load('api', 'version') 載入各種 API<br /> google.load('search', '1',{"language" : "zh-CN"});<br /> function OnLoad()<br /> {<br /> // Create a search control<br /> //嘗試使用搜尋控制項功能前，請始終確保在Google AJAX Search API 使用的主要對象是 SearchControl 的執行個體<br /> var searchControl = new google.search.SearchControl();<br /> // Add in a full set of searchers<br /> /*使用 addSearcher() 方法將類型<br /> LocalSearch、WebSearch、VideoSearch、BlogSearch、NewsSearch、<br /> ImageSearch、PatentSearch 和 BookSearch 的子物件添加到搜尋控制項中，<br /> 這些搜尋器對象可確定該搜尋控制項會在哪些搜尋服務中執行搜尋<br /> 添加這些搜尋器對象時候，可設定擴充模式options.setExpandMode */<br /> options = new google.search.SearcherOptions();<br /> /*google.search.SearchControl.EXPAND_MODE_PARTIAL 結果顯示為“開放”擴充模式的子集<br /> google.search.SearchControl.EXPAND_MODE_OPEN 在對象中儘可能完整顯示的結果<br /> google.search.SearchControl.EXPAND_MODE_CLOSE結果被從視圖中隱藏，除非通過使用 UI 元素（例如箭頭）開啟 */<br /> options.setExpandMode(google.search.SearchControl.EXPAND_MODE_CLOSE);<br /> //將給定服務的搜尋結果投影到網頁上的任意位置,這裡放到searchWeb裡<br /> options.setRoot(document.getElementById("searchWeb"));<br /> var localSearch = new google.search.LocalSearch();<br /> searchControl.addSearcher(localSearch);<br /> // load a searcher with these options,下面同樣可設定，這裡沒設定<br /> searchControl.addSearcher(new google.search.WebSearch(),options);<br /> searchControl.addSearcher(new google.search.VideoSearch());<br /> searchControl.addSearcher(new google.search.BlogSearch());<br /> searchControl.addSearcher(new google.search.NewsSearch());<br /> searchControl.addSearcher(new google.search.ImageSearch());<br /> searchControl.addSearcher(new google.search.BookSearch());<br /> searchControl.addSearcher(new google.search.PatentSearch());<br /> //設定網站限制<br /> var siteSearch = new google.search.WebSearch();<br /> siteSearch.setUserDefinedLabel("網易163新聞");<br /> siteSearch.setUserDefinedClassSuffix("siteSearch");<br /> siteSearch.setSiteRestriction("news.163.com");<br /> searchControl.addSearcher(siteSearch,options);<br /> // Set the Local Search center point<br /> localSearch.setCenterPoint("南京市");<br /> // tell the searcher to draw itself and tell it where to attach<br /> //draw()預設情況下，搜尋控制項將繪製“線性”布局；<br /> var drawOptions = new google.search.DrawOptions();<br /> drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_LINEAR);//線性<br /> //您還可以指示該控制項繪製“標籤式”布局<br /> //drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);//標籤<br /> //可以將“搜尋方塊”與搜尋結果集分開,如果不設定，搜尋方塊與結果顯示在同一DOM對象中<br /> drawOptions.setSearchFormRoot(document.getElementById("searchForm"));</p><p> searchControl.draw(document.getElementById("searchResult"),drawOptions);<br /> // execute an inital search<br /> //調用搜尋控制項的 execute() 方法，傳遞搜尋字詞語的參數以編程方式開始搜尋<br /> searchControl.execute("南京湖南路");</p><p> // establish a keep callback<br /> searchControl.setOnKeepCallback(this, MyKeepHandler);<br /> }<br /> function MyKeepHandler(result)<br /> {<br /> // clone the result html node<br /> var node = result.html.cloneNode(true);<br /> alert(node.innerHTML);<br /> // attach it<br /> //var savedResults = document.getElementById("saved_results");<br /> //savedResults.appendChild(node);<br /> }<br /> google.setOnLoadCallback(OnLoad);</p><p>// --></mce:script><br /> </head><br /> <body><br /> <div><br /> <div id="searchForm" style="width:400px;border:thick groove yellow;"></div><br /> <div style="float:left;" mce_style="float:left;"><br /> <div id="searchResult" style="width:400px;border:thick groove blue;float:left;">Loading</div><br /> <div id="searchWeb" style="width:400px;border:thick groove black;float:left;">Loading</div><br /> </div><br /> </div><br /> </body><br /></html>
可自訂CSS，簡單樣本，具體參考類文檔或用Firebug
#searchWeb .gsc-title{color:#330066;}<br /> #searchWeb {background-color:#CCFFFF;}<br /> .gsc-resultsHeader {font-size:12pt; color:#CC3300;}<br /> .gsc-results .gsc-webresults {color:Gray;backgroud-color:#CCFFFF;}<br /> #searchWeb a.gs-title{color:#3366CC;font-size:10pt;font-weight:bold;}<br /> .gs-snippet{font-size:9pt;backgroud-color:#CCFFFF;}<br /> .gs-snippet b{color:Red;}<br /> #searchWeb a.gs-title b{color:Black;}<br /> #searchWeb .gs-webResult .gs-visibleUrl-short { display:none; }<br /> #searchWeb .gs-webResult .gs-visibleUrl-long { display:block; color:#003333;}
link:
google 搜尋API類參考
google 搜尋AP‘documentation
google Code Playground
本文來自smallkonrad的CSDN部落格，轉載請標明出處：http://blog.csdn.net/smallkonrad/archive/2009/07/02/4316257.aspx
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
