国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開(kāi)APP
userphoto
未登錄

開(kāi)通VIP,暢享免費(fèi)電子書(shū)等14項(xiàng)超值服

開(kāi)通VIP
追求簡(jiǎn)約而且簡(jiǎn)單的AJAX封裝:Prototype

前幾天看到追求“簡(jiǎn)約不簡(jiǎn)單”的ORM映射框架這篇文章,發(fā)現(xiàn)作者不僅是一個(gè)寫(xiě)程序的高手,還是一個(gè)文學(xué)上的高手,用陳道名來(lái)比喻“簡(jiǎn)約”和“不簡(jiǎn)單”真的是非常貼切。其實(shí)作為程序員,大家在看到一個(gè)讓自己動(dòng)心的東西的時(shí)候,心里就是會(huì)有這樣的感覺(jué)。比如我這里提到的Prototype,一看到它,我就喜歡上了它,覺(jué)得它“簡(jiǎn)約而且簡(jiǎn)單”,就像劉亦菲,不需要什么花哨的表演,只要清麗脫俗的面容就夠了。Prototype可以說(shuō)就是這樣一個(gè)對(duì)AJAX的封裝,我沒(méi)有把它稱(chēng)為框架,就是因?yàn)樗?jiǎn)單。

Prothotype主要包含三個(gè)內(nèi)容:1.提供了一些全局的函數(shù),來(lái)替代原先繁瑣重復(fù)的代碼;2.對(duì)現(xiàn)在的Javascript, Dom等對(duì)象進(jìn)行擴(kuò)展,提供訪問(wèn)公共函數(shù)的捷徑;3.對(duì)Ajax的封裝,使得開(kāi)發(fā)Ajax更容易和快速。

全局性的函數(shù),比較有代表性的是$系列函數(shù)和Try.these()函數(shù)。
$()函數(shù):來(lái)替代document.getElementById()方法。如果傳入多個(gè)ID,則返回一個(gè)Array。
用法:

var ele = $(‘your element‘s id‘);

 

$F()函數(shù):用以返回表單控件的值,比如:文本框,下拉列表,必須是有value屬性的控件,傳入控件的ID。
用法:

var ele = $F(‘your element‘s id‘);


$A()函數(shù):可以接受任何一個(gè)枚舉類(lèi)型轉(zhuǎn)換為一個(gè)數(shù)組。
用法:

var nodeList = document.getElementsByTagName();
var nodeArray = $A(nodeList);
var message = "The All Message: ";
nodeArray.each(
  
function(node){
    message 
+= node.type + " | " + node.name + " | " + node.value + "\r\n"
  }

);
alert(message);

 
$H()函數(shù):將傳入的對(duì)象轉(zhuǎn)換一個(gè)可枚舉的和聯(lián)合數(shù)組類(lèi)似的Hash對(duì)象。
$R()函數(shù):是對(duì) new ObjectRange(lowBound, upperBound, excludeBounds)的縮寫(xiě)和替代。
 
Try.these()函數(shù):使用一系列函數(shù)作為參數(shù)。返回第一個(gè)成功執(zhí)行函數(shù)的有返回值。這樣就不用if else去判斷了。比如,我們創(chuàng)建XMLHttpRequest對(duì)象的時(shí)候,為了保持瀏覽器兼容,往往需要編寫(xiě)這樣的代碼:

var xhr = null;
if(window.XMLHttpRequest(){
  xhr 
= new XMLHttpRequest();
  
if(xhr.overrideMimeType)xhr.overrideMimeType("text/xml");
}

else if(window.ActiveXObject){
  
try{
    xhr 
= new ActiveXObject("Msxml2.XMLHTTP");
  }
catch(e){
    
try{
      xhr 
= new ActiveXObject("Microsoft.XMLHTTP");
    }
catch(e){}
  }

}


而現(xiàn)在,使用Try.these()函數(shù),這些繁瑣的過(guò)程變得異常簡(jiǎn)單。

function doInitialXHR(){
  
return Try.these(
    
function(){return new ActiveXObject(‘Msxml2.XMLHTTP‘)},
    
function(){return new ActiveXObject(‘Microsoft.XMLHTTP‘)},
    
function(){return new XMLHttpRequest()}
  )
}
 


Prototype對(duì)Javascript的Object, Number, Function, String, Array, Event等對(duì)象都進(jìn)行了擴(kuò)展,創(chuàng)建了一些新的對(duì)象和類(lèi),并在基礎(chǔ)上有很多公用函數(shù),比如each(), any(), collect()等。

each()可以讓我們項(xiàng)在Ruby、.net語(yǔ)言那樣遍歷集合中的元素。該方法使用iterator依次獲取集合中的每個(gè)元素,并將其作為匿名函數(shù)的參數(shù);也可以在該匿名函數(shù)中加上可選參數(shù)index,獲取當(dāng)前元素的索引值。下面的例子使用each()方法,對(duì)一個(gè)保存貨物價(jià)格的數(shù)組進(jìn)行遍歷,顯示其價(jià)格及其索引值:

function doEachTest(){
  
var prices = {100.2445552.356.0};
  prices.each(
    
function(price,index){
      window.alert(
"value:" + price + "| index:" + index);
    }

  }

}

 
除此之外,Prototype還對(duì)Ajax提供的支持,主要由Ajax.Request和Ajax.Updater兩個(gè)來(lái)完成。使用這兩個(gè)類(lèi),可以應(yīng)付大部分的AJAX應(yīng)用,而且不需要繁瑣的實(shí)例化XHR、監(jiān)控請(qǐng)求狀態(tài)的過(guò)程。
 
假設(shè)我們將書(shū)籍信息保存在一個(gè)XML文檔內(nèi),如下:

<?xml version="1.0" encoding="gbk"?>
<books>
    
<book>
        
<title>AAAAAAA</title>
        
<page>111</page>
    
<book>
    
<book>
        
<title>BBBBBBB</title>
        
<page>222</page>
    
<book>
</books>


現(xiàn)在,我們使用Ajax.Request類(lèi)去獲取這個(gè)XML文檔的內(nèi)容,并將其顯示出來(lái),如下: 

function doAjaxRequest(){
    
var url = "books.xml";
    
var ajax = new Ajax.Request(url, {method:"get", onComplete:showResponse});
}

 
function showResponse(request){
    window.alert(request.responseText);
}

 
method為方法類(lèi)型,如get,post等;onComplete為回調(diào)函數(shù),通常在這個(gè)函數(shù)中完成對(duì)相應(yīng)數(shù)據(jù)的解析和顯示。如果服務(wù)器返回的是已經(jīng)格式化的HTML代碼,則可以使用Ajax.Updater。下面的例子,使用Ajax.Updater將服務(wù)器的響應(yīng)數(shù)據(jù)填充道指定的div中:

function doAjaxUpdater(){
    
var url = "your_url.jsp";
    
var params = "field=all&show=true";
    
var ajax = new Ajax.Updater("divContent", url, {method:"get", parameters:params});
}

 
<input type="button" value="Ajax.Updater" onclick="doAjaxUpdater()">
<span id="divContent"></span>


"divContent"為要將返回內(nèi)容插其中的控件ID。


參考資料:柯自聰 《Prototype的開(kāi)發(fā)與應(yīng)用實(shí)踐》 (程序員第11期)

本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶(hù)發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊舉報(bào)。
打開(kāi)APP,閱讀全文并永久保存 查看更多類(lèi)似文章
猜你喜歡
類(lèi)似文章
Prototype教程
ajax問(wèn)題總結(jié)
Ajax總結(jié)篇
使用Ajax與服務(wù)器(JSON)通信
AJAX優(yōu)勢(shì)、跨域方案及JSON數(shù)據(jù)格式和瀏覽器中JSON對(duì)象
原生JavaScript手寫(xiě)Ajax
更多類(lèi)似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長(zhǎng)圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服