原生Ajax與jQuery中的ajax操作

2021-07-13 17:01:17 字數 1572 閱讀 1692

一.基本實現

1.建立xmlhttprequest物件

現代瀏覽器基本都內建了xmlhttprequest物件,若要相容低版本瀏覽器(ie5,ie6等),則需要對其做相容處理

}}2.建立狀態監聽處理

function

readystatechangehandle

() }

}

ajax響應狀態碼:(具體參考ajax請求時status返回狀態明細表

3.傳送請求,建立連線

if(xmlhttp)
第乙個引數為請求的方式,常用請求方式為get和post;

第二個引數為請求的url,型別有txt,html,xml等;

第三個引數為是否非同步請求,預設為true;

get請求與post請求傳參的差別

二.3種資料互動方式

(1).txt格式

(2).xml格式

function

xml(url)

"msg">

"test('ajax_data.xml')">btn

(3).json格式

使用eval(string)將json解析成物件

var txt = "";

var txtobj = eval( "(" + txtobj + ")" );

然後便可以以物件的方式對資料進行訪問:

txtobj.userid ; //17

三.jquery中的ajax方法

+ $.ajax() 方法是屬於最底層的方法,

+ 第二層是 .load(), $.get() ,$.post()方法,

+ 第三層是 getscript() 和 getjson() 方法。

(1). 可以使用.load()方法載入乙個頁面,或者載入頁面中的一部分

$(

"#aid").load("test.html"); //

#aid 為要載入html頁面的容器

$("#aid").load("test.html #bid");

(2).$get()方法

$.get(url[,data][,callback]);

$("#btn").click(function

() );

});

(3).jquery.ajax()函式

$.ajax(url[,options])

$.ajax(options) 此時url是options的第乙個引數

$.ajax()

原生Ajax與jQuery的Ajax和偽Ajax

用原生的ajax傳送請求var xhr new xmlhttprequest xhr.open 請求方式 post get 請求url true xhr.onreadystatechange function xhr.send 傳送的資料 用jquery的ajax傳送請求 ajax 用偽ajax如果...

原生ajax和jQuery中的ajax使用

ajax是一種能夠向伺服器請求額外的資料而不需重新整理頁面,會帶來更好的使用者體驗。ajax技術的核心是xmlhttprequest物件。ie7及現在瀏覽器中,使用原生xhr建立 ajax請求有兩種,同步請求和非同步請求,在open 中第三個引數設定是否非同步 true代表該次請求非同步,false...

ajax 原生實現 與 jquery實現)

1 原生j ascript實現ajax請求 參見w3c 值得注意的是寫請求路徑是 一定不需要加 2 jquery實現ajax互動 ajax functionfun2 success function data get 請求路徑 請求引數 函式 返回資料的格式 post 請求路徑 請求引數 函式 返回...