在取得Google AJAX Search API密鑰後，
我們就可以開始撰寫Google AJAX Search API的應用程式了。
首先來看看我們第一個Google AJAX Search API程式HelloWorld.html的程式碼。
<html>
<head>
<title>My Google AJAX Search API Application</title>
<!--請在key=之後，輸入自己的Google AJAX Search 密鑰—>
<script src="http://www.google.com/jsapi?key=" type="text/javascript"></script>
<script language="Javascript" type="text/javascript">
google.load("search", "1");
function OnLoad() {
// 建立搜尋控制容器
var searchControl = new google.search.SearchControl();
// 新增搜尋器
// 網頁搜尋
searchControl.addSearcher(new google.search.WebSearch());
//影片搜尋
searchControl.addSearcher(new google.search.VideoSearch());
//部落格搜尋
searchControl.addSearcher(new google.search.BlogSearch());
// 將搜尋結果顯示在網頁中
searchControl.draw(document.getElementById("searchcontrol"));
// 設定預設搜尋項目
searchControl.execute("HelloWorld");
}
google.setOnLoadCallback(OnLoad); //載入頁面時執行OnLoad函式
</script>
</head>
<body>
<div id="searchcontrol">Loading...</div>
</body>
</html>
當我們利用文字編輯器(例如：Windows中的記事本)打好上面的程式碼，
並儲存成HelloWorld.html後，
請用瀏覽器開啟該程式，
就會得到以下的結果。
到底我們的第一個Google AJAX Search API程式是怎麼運作的呢？
首先，
我們必須將我們申請好的Google AJAX Search API密鑰放入程式碼中。
如果我們沒有輸入正確的密鑰，程式將不會正常執行。
<script src="http://www.google.com/jsapi?key="" type="text/javascript">
</script>
設定好正確密鑰，
接下來我們就必須利用google.load這個函式載入Google AJAX Search API。
google.load("search", "1");
google.load必須帶入兩個引數，
第一個是載入Google API的種類，
由於Google公司有許多的API都可以透過google.load這個函式載入。
因此要載入不同的API就需要帶入不同的代碼，
這裡請填上Google AJAX Search API的代碼search。
第二個引數是載入Google API的版本，
由於目前Google AJAX Search API的版本是1，
所以請在這裡填入1。
緊接著利用addSearcher這個函式將
網頁搜尋元件google.search.WebSearch()、
影片搜尋元件google.search.VideoSearch()
與部落格搜尋元件google.search.BlogSearch()
加入搜尋控制容器中。
如此一來，
搜尋控制容器就可以針對網頁、影片與部落格進行搜尋了。
searchControl.addSearcher(new google.search.WebSearch());
searchControl.addSearcher(new google.search.VideoSearch());
searchControl.addSearcher(new google.search.BlogSearch());
利用document.getElementById這個函式，
可以幫助我們取得HTML中id為searchcontrol的<div>網頁區塊。
把searchcontrol這個<div>元件傳入draw這個函式中，
就可以將搜尋的結果顯示在searchcontrol這個網頁區塊中。
searchControl.draw(document.getElementById("searchcontrol"));
最後我們必須使用google.setOnLoadCallback這個函式，
讓網頁在瀏覽器中載入時，
可以先去執行OnLoad這個JavaScript函式。
google.setOnLoadCallback(OnLoad);
透過上述的程序，
就可以建立我們的第一個Google AJAX Search API程式。
這個程式能讓我們在網頁上對網頁、影片與部落格進行搜尋。
當然Google AJAX Search API還有許多更有趣的功能可以使用，
筆者將陸續在[Google API]這系列為各位網友繼續介紹。
PS：如果網友對Google API有興趣，
也可以參考我所撰寫的【Google APIs程式工具錦集】一書。
留言列表
旅遊風 (8)
