详解XMLHTTP对象封装手艺的示例代码【XML教程】,XML，HTTP，对象封装

ajax手艺的完成重要依赖于xmlhttprequest，但我们在挪用其来举行异步数据的传输时，由于xmlhttp是个短线历程（处置惩罚事宜完成后就烧毁）假如不对该对象举行包装处置惩罚的话，就不能不在须要挪用的处所从新构建xmlhttprequest，每次挪用都要写一大段的代码，着实不是个好办法。幸亏如今许多开源的ajax框架都供应了对xmlhttp封装的计划。这里以ajaxtags自带的prototype-1.4.0.js为母版，来看看怎样将xmlhttp对象封装成一个可复用的要领。

在prototype.js中，起首定义了一个变量：Ajax

　 var Ajax = {
　　　 getTransport: function() {
　　　　 return Try.these(
　　　　　 function() {return new ActiveXObject('Msxml2.XMLHTTP')},
　　　　　 function() {return new ActiveXObject('Microsoft.XMLHTTP')},
　　　　　 function() {return new XMLHttpRequest()}
　　　 ) || false;
　 },
　　 
　　 activeRequestCount: 0
}

变量返回了一个xmlhttprequest，能够看到，假如我们挪用了Ajax.getTransport()，每次都邑返回一个新的xmlhttprequest对象。

在Ajax变量中定义了一个基本要领Ajax.Base和该基本要领的原型（初始时，每一个剧本要领默许都有个空的原型，该原型会继续Object的原型，假如我们在Object中转变了原型，则一切的剧本要领都邑被转变。）该基本要领被Ajax.Request所继续，注重的是，假如在Ajax.Request中添补了继续的原型的同名要领或变量，则会完成重载。

Ajax.Base原型中最重要的是setOptions要领，过会我们就会用到。

setOptions: function(options) {
　　 this.options = {
　　　 method:　　　 'post',
　　　 asynchronous: true,
　　　 parameters:　 ''
　　 }

prototype中对request是经由过程定义Ajax.Request原型（Ajax.Request.prototype）来完成的。但我们并不能直接对Ajax.Request举行挪用，重要原因是Ajax.Request并没有供应一个一致处置惩罚的历程。而且我们能够须要经由过程request 再获得response。（试想一下，客户那里发出一条信息，都一直没与收到复兴，那是会让人觉得很恼火的事~），prototype一样为我们封装好了resoponse（Ajax.Responders），但二者都是互相自力的，怎样把他们举行整合呢？

在 prototype中给我们供应了两个计划，一个是Ajax.Updater，另一个是Ajax.PeriodicalUpdater，两个共同点都是必需传入3个参数：

container：

response数据要转达的位置，该位置经由过程html标签的id举行定义，比方你要把返回的数据输出到html中的某个＜div＞中，则只要把container改成该id的值就能够了。假如找不到该container，则会发作剧本毛病。

url：

request要求要通报的目的地。该目的地应当是个servlet或jspservlet，由于request对象只能被servlet中的do***要领自动猎取。

options：

构造应当与上面Ajax.Base定义的setOptions（）中的option构造雷同，假如为空或不写，则采纳 Ajax.Base定义的初始值（没有通报任何参数时运用）。

二者的区别在与Ajax.Updater返回给container的是完整的responseText，只要在responseText完整获得又没发作非常时才会把内容写到container内里，而PeriodicalUpdater在猎取responseText时，不论是不是已完整获得，就把内容填进container，直到发作非常或完整获得responseText。大多数状况应当运用第一种要领，由于第一种要领在发作非常时会把非常信息显现在container内里，而第二种就不肯定了。

既然已把xmlhttp封装好了，我们只须要设置好前面所说的3个参数就能够了，要注重的是，设置options参数，肯定要根据base中的options构造举行设置，假如我们运用post要领，还能够在opitons中设置postBody属性，把要通报的queryString 放到body中,一个运用post要领举行通报的剧本例子以下：

/*表单提交用post要领*/
function doRequest(container,paraments,url){
　　 var options ={
　　　 method:　　　 'post',
　　　 asynchronous: true,
　　　 postBody: paraments
　　 };
　　 new Ajax.Updater(container,url,options);　　
}

末了不能不说的是中文编码题目，prototype对通报的参数都举行了编码转换事情，每一个通报值经由过程encodeURIComponent　举行了处置惩罚．编码会被转换成utf－8，在背景猎取request时，应当一致运用request.setCharacterEncoding("UTF-8")对request设置编码，而没必要管页面的编码花样是什么．假如运用post要领举行通报数据，则会自动实行:

request．setHeader('Content-type','application/x-www-form-urlencoded').确保通报数据编码花样的准确.

以上就是详解XMLHTTP对象封装手艺的示例代码的细致内容，更多请关注ki4网别的相干文章！