首頁 > 後端開發 > XML/RSS教程 > XML-OpenSearch應用的具體介紹

XML-OpenSearch應用的具體介紹

黄舟
發布: 2017-03-14 16:09:45
原創
1883 人瀏覽過

很多現代的瀏覽器在網址列的右邊有個搜尋框,預設的安裝有 Google 搜尋等。如下圖所示: 其實這是 OpenSearch 的一個應用,只要寫出對應的微格式的 xml 文件,就可以發展出對應的搜尋框。參考 OpenSearch 的定義文檔,可以基本上獲得基本的 xml 格式。例如某個典型的搜
很多現代的瀏覽器在網址列的右邊有個搜尋框,預設的安裝有 Google 搜尋等。如下圖所示:
XML-OpenSearch應用的具體介紹
其實這是 OpenSearch 的一個應用,只要編寫對應的微格式的 xml 文件,就可以發展出對應的搜尋框。參考 OpenSearch 的定義文檔,可以基本上獲得基本的 xml 格式。例如某個典型的搜尋 xml 檔可以這樣指定。

<?xml version="1.0" encoding="UTF-8"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
 <InputEncoding>utf-8</InputEncoding>
 <ShortName>ShortName</ShortName>
 <Description>Description</Description>
 <Image type="image/vnd.microsoft.icon">favicon</Image>
 <Url type="text/html" template="http://who.am.i/search?word={searchTerms}"/>
 </OpenSearchDescription>
登入後複製


上面的 xml 檔案很容易理解,除了固定的 xml 根以外,其他的定義從字面上就可以理解:    InputEncoding 指定搜尋的編碼,依網站的實際情況而定    ShortName 這個是搜尋的短名稱,例如“Google 搜尋”    Description 針對這個搜尋框的描述,例如“淘寶購物搜尋 - 只有你想不到,沒有你淘不到”    Image 類似網頁的 favicon ,用於識別搜尋    Url 這個是最重要的參數,指定搜尋的連結。它有許多參數,一般使用 {searchTerms} 參數指定搜尋詞即可。參數type=”text/html” 註明回傳的是頁面(瀏覽器會跳到這個頁面),如果是其他格式就會使用對應預設程式開啟(例如type=”application/rss xml” 就會使用RSS 閱讀器開啟)。
編寫 OpenSearch 的 xml 格式就完成了,詳細資訊可以參考其 OpenSearch 定義文件。下面要在頁面中加入這個搜索,基本上可以分成兩種方式。分別是頁面的在 head 中加入 link 標記(類似 RSS),以及使用 Javascript 方式添加(例如定義某個按鈕觸發)。加入link 標記非常簡單,格式如下

<link rel="search" type="application/opensearchdescription xml"
 href="http://who.am.i/search.xml" title="ShortName" />
登入後複製


#與RSS 相似,rel 和type 是固定的,我們主要指定href (上述xml 的url 路徑,保險起見使用絕對路徑,即http:// 開頭)以及title (也就是搜尋的短標題)即可。就這樣,在 Explorer 以及 Firefox 中打開這個頁面就可以看見相應的菜單了,如圖所示:
XML-OpenSearch應用的具體介紹
使用 Javascript 添加比較麻煩(或許現在的情況會很好多)。我們主要會使用瀏覽器的擴充功能,在 Explorer 有個 window.external.AddSearchProvider 參數(詳細文件)。典型的呼叫方法如下

window.external.AddSearchProvider(&#39;http://who.am.i/search.xml&#39;);
登入後複製

參數中的連結就是上述 link 中的內容。在 Firefox 下可以使用

window.sidebar.addSearchEngine(
 "http://who.am.i/search.xml", /* engine URL */
 "favicon.ico", /* icon URL */
 "ShortName", /* engine name */
 "Description" ); /* category name */
登入後複製


#參數和範例如範例程式碼所述(官方文件)。值得注意的是在 Firefox2 版本以後已經「相容」 Explorer 的 window.external.AddSearchProvider 呼叫方法(詳細資訊)。那我們對應的Javascript 程式碼就可以這樣寫(為了相容Firefox2 之前的版本,加入else if 判斷,如果覺得沒有必要,可以不加)

#
function addEngine(){
 if (window.external || window.external.AddSearchProvider) {
 window.external.AddSearchProvider(&#39;http://who.am.i/search.xml&#39;);
 } else if (window.sidebar && window.sidebar.addSearchEngine) {
 window.sidebar.addSearchEngine(
 "http://who.am.i/search.xml",
 "favicon.ico", /* icon URL */
 "ShortName", /* engine name */
 "Description" ); /* category name */
 }}
登入後複製


這樣,就可以將這個函數註冊到某個連結或按鈕的點擊事件中,就會跳出個確認框,如圖使用者點擊確認以後,就加入到瀏覽器搜尋框中了。                                                

#

以上是XML-OpenSearch應用的具體介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板