AJAX初體驗之上手篇

ajax初體驗之上手篇

ajax是這兩年蠻熱的東西，我也湊湊熱鬧，前些天去找了些教程學學，下面就按整個處理過程把自己學的東西寫寫，不過，因為是初學，所以有錯誤就請見諒啦，歡迎指正^_^。

1.建立 xmlhttprequest 物件

現在的瀏覽器有很多種，建立 xmlhttprequest 的方法也不相同，所以為了相容各種瀏覽器，在建立 xmlhttprequest 時也應該考慮到各種瀏覽器的情況。目前主流的瀏覽器在windows下有ie、firefox及opera，所以我們寫的**要盡量相容這幾個瀏覽器。在參考了一些資料後，我用下面的方法來建立 xmlhttprequest 物件：

code:

// 先定義乙個變數，並賦初值為 false，方便後面判斷物件是否建立成功

var xmlobj = false;

// 使用 try 來捕獲建立失敗，再換個方法來建立

try

catch(e)

catch(e2)

catch(e3) }}

// 如果建立 xmlhttprequest 物件失敗，那麼提醒訪問者該頁面可能無法正確訪問

if (!xmlobj)

2.使用 xmlhttprequest 來獲取 xml 文件

在用 xmlhttprequest 來獲取 xml 需要注意這個文件必需和自己在同乙個域中，我的理解是同乙個網域名稱之下，或者同一目錄之中，如果不是就會出現「拒絕訪問」的錯誤。在本地高度時，也必需執行乙個 web 伺服器，而不能直接在瀏覽器裡開啟這個網頁。

code:

// 使用 open 方法來開啟乙個請求，這個方法有3個引數，分別是請求方式，請求檔案的url及同步方式(?不是很清楚具體叫什麼來的:)

// 請求方式可以是 get，post，head中的一種，因為我要獲取檔案，所以用 get

// 請求檔案的url，直接用相對路徑即可

// 同步方式，表示請求發出後是等待回應(false)還是繼續執行下面的**(true)，即所謂非同步了。ajax的第乙個a就是表示非同步了，所以這裡用 true

xmlobj.open ("get", "sample.xml", true);

// 因為使用非同步方式所以要在 xmlhttprequest 物件的狀態改變時做相應的處理

xmlobj.onreadystatechange=function() }}

// 傳送請求，因為是get，所以send的內容為null

xmlobj.send(null);

3.用asp來建立xml文件

為了動態顯示的需要，就要用到動態網頁了，我用的是asp。

code:

' 修改頭標識指明這是乙個xml文件

response.contenttype="text/xml"

' ......

strxml="<?xml versin=""1.0"" encoding=""utf-8""?>"

' 這裡就按xml的要求來輸出資料庫裡的內容了

strxml=strxml&"....."

' ......

response.write(strxml)

4.處理xml文件

在獲取了xml文件之後，就要從中獲取需要的東西了，假如我從服務獲取了下面的xml文件：

code:

<?xml version="1.0" encoding="gb2312"?>

ajax study

study ajax

我要的是title及content的內容，那麼可以像下面這樣做：

code:

function domyxml()

好了，現在已經得到我想要的東西，可以把它們顯示出來了。

5.輸出處理結果

先假定有乙個如下的html文件用來顯示想要輸出的內容：

code:

這裡定義了乙個id為mydisplay的div容器用來顯示輸出內容，好了，再轉到js：

code:

//...接domyxml;

//content=items[0].....;

var strhtml;

// 先組織好要顯示的內容

strhtml="item title: " + title + "

item content: " + content;

// 獲取目標容器，再設定它的innerhtml為要顯示的內容

document.getelementbyid("mydisplay").innerhtml=strhtml;

AJAX初體驗之上手篇

Ajax初體驗之登入校驗

Synopsys初體驗軟體安裝篇

python初體驗（1）基礎篇

AJAX初體驗之上手篇

Ajax初體驗之登入校驗

Synopsys初體驗 軟體安裝篇

python初體驗（1） 基礎篇

相關推薦

Synopsys初體驗軟體安裝篇

python初體驗（1）基礎篇