Ajax 數(shù)據(jù)請(qǐng)求的簡(jiǎn)單分析
更新時(shí)間:2011年04月05日 21:42:51 作者:
Ajax使用的關(guān)鍵對(duì)象是XmlHttpRequest對(duì)象,但是涉及到跨瀏覽器的的問(wèn)題,所以,需要?jiǎng)?chuàng)建一個(gè)具兼容性的對(duì)象
比如:
function xmlHttpR(){
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
else{
try{xmlhttp=new ActiveXObject("Msxml2.XMLHTTP")}
catch(e){
try{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){return null;
}
}
return xmlhttp;
這樣就基本上能創(chuàng)建一個(gè)跨瀏覽器的對(duì)象了;
下面是ajax的簡(jiǎn)單運(yùn)用,利用XmlHttpRequest對(duì)象完成;
var ajaxEl=new Object();
//ajaxEl是自定義的命名空間;
ajaxEl.contentLoad=function(url){
//IE瀏覽器下,會(huì)啟用緩存,這里url加入date字段就是為了防止IE使用緩存,當(dāng)然也可以使用Math.random()產(chǎn)生和getTime類似的效果;
url+="?date="+new Date().getTime();
this.req=null;
this.url=url;
//這個(gè)回調(diào)函數(shù)就是在數(shù)據(jù)在頁(yè)面上的更新函數(shù);
this.onload=function(){
//domEl是ID為#test的dom元素;
var domEl=document.getElementById("test");
//除了用responseText屬性,也可以使用responseXml獲得一張數(shù)據(jù)表;
domEl.innerHTML=this.req.responseText;
}
this.Xmlhttp(url);
}
ajaxEl.contentLoad.prototype={
Xmlhttp:function(url){
if(window.XMLHttpRequest){
this.req=new XMLHttpRequest();
}
else{
try{this.req=new ActiveXObject("Msxml2.XMLHTTP")}
catch(e){
try{this.req=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){return null;
}
}
}
if(this.req){
var xmlR=this;
this.req.onreadystatechange=function(){
if(xmlR.req.readyState===4){
xmlR.onload.call(xmlR);
}
}
this.req.open("GET",url,true);
this.req.send(null);
}
}
}
var xmlE=new ajaxEl.contentLoad("main.php");
main.php里面,我這里設(shè)置的比較簡(jiǎn)單的示例代碼:在頁(yè)面上就會(huì)顯示一個(gè)類似:now! time is:05:18:10 am 2011,這樣可動(dòng)態(tài)變化的時(shí)間。
echo "now! time is:".date("H:i:s a Y");
復(fù)制代碼 代碼如下:
function xmlHttpR(){
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
else{
try{xmlhttp=new ActiveXObject("Msxml2.XMLHTTP")}
catch(e){
try{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){return null;
}
}
return xmlhttp;
這樣就基本上能創(chuàng)建一個(gè)跨瀏覽器的對(duì)象了;
下面是ajax的簡(jiǎn)單運(yùn)用,利用XmlHttpRequest對(duì)象完成;
復(fù)制代碼 代碼如下:
var ajaxEl=new Object();
//ajaxEl是自定義的命名空間;
ajaxEl.contentLoad=function(url){
//IE瀏覽器下,會(huì)啟用緩存,這里url加入date字段就是為了防止IE使用緩存,當(dāng)然也可以使用Math.random()產(chǎn)生和getTime類似的效果;
url+="?date="+new Date().getTime();
this.req=null;
this.url=url;
//這個(gè)回調(diào)函數(shù)就是在數(shù)據(jù)在頁(yè)面上的更新函數(shù);
this.onload=function(){
//domEl是ID為#test的dom元素;
var domEl=document.getElementById("test");
//除了用responseText屬性,也可以使用responseXml獲得一張數(shù)據(jù)表;
domEl.innerHTML=this.req.responseText;
}
this.Xmlhttp(url);
}
ajaxEl.contentLoad.prototype={
Xmlhttp:function(url){
if(window.XMLHttpRequest){
this.req=new XMLHttpRequest();
}
else{
try{this.req=new ActiveXObject("Msxml2.XMLHTTP")}
catch(e){
try{this.req=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){return null;
}
}
}
if(this.req){
var xmlR=this;
this.req.onreadystatechange=function(){
if(xmlR.req.readyState===4){
xmlR.onload.call(xmlR);
}
}
this.req.open("GET",url,true);
this.req.send(null);
}
}
}
var xmlE=new ajaxEl.contentLoad("main.php");
main.php里面,我這里設(shè)置的比較簡(jiǎn)單的示例代碼:在頁(yè)面上就會(huì)顯示一個(gè)類似:now! time is:05:18:10 am 2011,這樣可動(dòng)態(tài)變化的時(shí)間。
復(fù)制代碼 代碼如下:
echo "now! time is:".date("H:i:s a Y");
相關(guān)文章
jQuery解決input元素的blur事件和其他非表單元素的click事件沖突問(wèn)題
這篇文章主要介紹了jQuery解決input元素的blur事件和其他非表單元素的click事件沖突問(wèn)題,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-08-08基于jquery的simpleValidate簡(jiǎn)易驗(yàn)證插件
簡(jiǎn)易驗(yàn)證插件simpleValidate使用心得,基于JQuery,修改小BUG后能兼容各瀏覽器,附自用版本供下載2014-01-01JQuery的ajax獲取數(shù)據(jù)后的處理總結(jié)(html,xml,json)
三種數(shù)據(jù)格式中最簡(jiǎn)單的就是html格式,返回回來(lái)以后可以直接使用,上面的處理方式就是json的處理方式xml的處理方式。2010-07-07jQuery 1.4 15個(gè)你應(yīng)該知道的新特性(譯)
jQuery 1.4 最近剛剛發(fā)布. 這個(gè)版本可不是一個(gè)簡(jiǎn)單的改進(jìn),它不僅包含了很多新的特性,還改進(jìn)了很多功能, 更在性能優(yōu)化方面下了很大功夫, 本文將對(duì)這些新的特性和增強(qiáng)的部分進(jìn)行討論,希望能對(duì)你有所幫助.2010-01-01jQuery使用before()和after()在元素前后添加內(nèi)容的方法
這篇文章主要介紹了jQuery使用before()和after()在元素前后添加內(nèi)容的方法,實(shí)例分析了jQuery中before()和after()方法添加內(nèi)容的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-03-03一個(gè)用jquery寫(xiě)的判斷div滾動(dòng)條到底部的方法【推薦】
下面小編就為大家?guī)?lái)一篇一個(gè)用jquery寫(xiě)的判斷div滾動(dòng)條到底部的方法【推薦】。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考,一起跟隨小編過(guò)來(lái)看看吧2016-04-04jquery插件jquery倒計(jì)時(shí)插件分享
jquery倒計(jì)時(shí)插件分享,大家參考使用吧2013-12-12