javascript ajax

转载 2006年06月05日 18:44:00

/*
url-loading object and a request queue built on top of it
*/

/* namespacing object */
var net=new Object();

net.READY_STATE_UNINITIALIZED=0;
net.READY_STATE_LOADING=1;
net.READY_STATE_LOADED=2;
net.READY_STATE_INTERACTIVE=3;
net.READY_STATE_COMPLETE=4;


/*--- content loader object for cross-browser requests ---*/
net.ContentLoader=function(url,onload,onerror,method,params,contentType){
  this.req=null;
  net.currentLoader=this;
  this.onload=onload;
  this.onerror=(onerror) ? onerror : this.defaultError;
  this.loadXMLDoc(url,method,params,contentType);
}

net.ContentLoader.prototype.loadXMLDoc=function(url,method,params,contentType){
  if (!method){
    method="GET";
  }
  if (!contentType && method=="POST"){
    contentType='application/x-www-form-urlencoded';
  }
  if (window.XMLHttpRequest){
    this.req=new XMLHttpRequest();
  } else if (window.ActiveXObject){
    this.req=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (this.req){
    try{
      var loader=this;
      this.req.onreadystatechange=function(){
        net.ContentLoader.onReadyState.call(loader);
      }
      this.req.open(method,url,true);
      if (contentType){
        this.req.setRequestHeader('Content-Type', contentType);
      }
      this.req.send(params);
    }catch (err){
      this.onerror.call(this);
    }
  }
}


net.ContentLoader.onReadyState=function(){
  var req=this.req;
  var ready=req.readyState;
  if (ready==net.READY_STATE_COMPLETE){
     var httpStatus=req.status;
    //if (status==200 || httpStatus==0){
    if(httpStatus==200 || httpStatus==0){
      this.onload.call(this);
    }else{
      this.onerror.call(this);
    }
  }
}

net.ContentLoader.prototype.defaultError=function(){
  alert("error fetching data!"
    +"/n/nreadyState:"+this.req.readyState
    +"/nstatus: "+this.req.status
    +"/nheaders: "+this.req.getAllResponseHeaders());
}

 


/*--- queue system for efficient transfer of many small commands in a single request ---*/
net.cmdQueues=new Array();


net.CommandQueue=function(id,url,onUpdate,freq){
  this.id=id;
  net.cmdQueues[id]=this;
  this.url=url;
  this.queued=new Array();
  this.sent=new Array();
  this.onUpdate=onUpdate;
  if (freq){
    this.repeat(freq);
  }
  this.lastUpdateTime=0;
}

net.CommandQueue.STATUS_QUEUED=-1;
net.CommandQueue.STATE_UNINITIALIZED=net.READY_STATE_UNINITIALIZED;
net.CommandQueue.STATE_LOADING=net.READY_STATE_LOADING;
net.CommandQueue.STATE_LOADED=net.READY_STATE_LOADED;
net.CommandQueue.STATE_INTERACTIVE=net.READY_STATE_INTERACTIVE;
net.CommandQueue.STATE_COMPLETE=net.READY_STATE_COMPLETE;
net.CommandQueue.STATE_PROCESSED=5;

net.CommandQueue.PRIORITY_NORMAL=0;
net.CommandQueue.PRIORITY_IMMEDIATE=1;


net.CommandQueue.prototype.addCommand=function(command){
  if (this.isCommand(command)){
    this.queue.append(command,true);
    if (command.priority==net.CommandQueue.PRIORITY_IMMEDIATE){
      this.fireRequest();
    }
  }
}

net.CommandQueue.prototype.fireRequest=function(){
  if (!this.onUpdate && this.queued.length==0){
    return;
  }
  var data="lastUpdate="+this.lastUpdateTime+"&data=";
  for(var i=0;i<this.queued.length;i++){
    var cmd=this.queued[i];
    if (this.isCommand(cmd)){
      data+=cmd.toRequestString();
      this.sent[cmd.id]=cmd;
    }
  }
  this.queued=new Array();
  this.loader=new net.ContentLoader(
    this.url,
    net.CommandQueue.onload,
    net.CommandQueue.onerror,
    "POST",data
  );
}

net.CommandQueue.prototype.isCommand=function(obj){
  return (
    obj.implementsProp("id")
    && obj.implementsProp("priority")
    && obj.implementsFunc("toRequestString")
    && obj.implementsFunc("parseResponse")
  );
}

net.CommandQueue.onload=function(){
  var xmlDoc=this.req.responseXML;
  var elDocRoot=xmlDoc.getElementsByTagName("responses")[0];
  var lastUpdate=elDocRoot.attributes.getNamedItem("updateTime");
  if (parseInt(lastUpdate)>this.lastUpdateTime){
    this.lastUpdateTime=lastUpdate;
  }
  if (elDocRoot){
    for(i=0;i<elDocRoot.childNodes.length;i++){
      elChild=elDocRoot.childNodes[i];
      if (elChild.nodeType==1){
        if (elChild.tagName=="command"){
          var attrs=elChild.attributes;
          var id=attrs.getNamedItem("id").value;
          var command=net.commandQueue.sent[id];
          if (command){
            command.parseResponse(elChild);
          }
        }else if (elChild.tagName=="update"){
          if (this.implementsFunc("onUpdate")){
            this.onUpdate.call(this,elChild);
          }
        }
      }
    }
  }
}

net.CommandQueue.onerror=function(){
  alert("problem sending the data to the server");
}

net.CommandQueue.prototype.repeat=function(freq){
  this.unrepeat();
  if (freq>0){
    this.freq=freq;
    var cmd="net.cmdQueues["+this.id+"].fireRequest()";
    this.repeater=setInterval(cmd,freq*1000);
  }
}
net.CommandQueue.prototype.unrepeat=function(){
  if (this.repeater){
    clearInterval(this.repeater);
  }
  this.repeater=null;
}

JavaScript、Ajax与jQuery的关系

简单总结: 1、JS是一门前端语言。 2、Ajax是一门技术,它提供了异步更新的机制,使用客户端与服务器间交换数据而非整个页面文档,实现页面的局部更新。 3、jQuery是一个框架,它对JS进行...
  • jediael_lu
  • jediael_lu
  • 2014年07月31日 10:15
  • 30339

HTML、CSS、JavaScript及AJAX是什么

HTML、CSS、JavaScript及AJAX简介
  • xu_ya_fei
  • xu_ya_fei
  • 2016年04月23日 16:00
  • 1291

原生javascript实现ajax 发送post请求

var postData = { "name1": "value1", "name2": "value2"}; postData = (function(obj){ // 转成po...
  • u011562107
  • u011562107
  • 2016年01月26日 13:47
  • 3723

原生JavaScript实现ajax异步请求代码

jQuery封装了JavaScript的一些常用方法,而jQuery中的$ajax(),$get(),$post()是比较常用的方法,也是大家最熟悉,最常用的,但是在面试时,通常面试官,会要求你手写原...
  • pedrojuliet
  • pedrojuliet
  • 2016年11月27日 18:47
  • 4640

Ajax的全称是:AsynchronousJavaScript+XML

1.什么是Ajax? Ajax的全称是:AsynchronousJavaScript+XML 2.Ajax的定义: Ajax不是一个技术,它实际上是几种技术,每种技术都有其独特这处,合在一起就成了一个...
  • clamp_hbu
  • clamp_hbu
  • 2007年06月09日 20:15
  • 416

JavaScript原生ajax示例

方法: (1)创建XMLHttpRequest对象,这个对象就是ajax请求的核心,是ajax请求和响应的信息载体,单是不同浏览器创建方式不同 (2)请求路径 (3)使用open方法绑定发送请...
  • u013063153
  • u013063153
  • 2016年07月11日 10:12
  • 1213

【JavaScript】AJAX总结(异步JavaScript和XML)

AJAX介绍 通过 AJAX,你可以创建更好、更快以及更友好的 WEB 应用程序。 AJAX 基于 JavaScript 和 JavaScript的XMLHttpRequest对象。 AJAX 应用程...
  • oYunTaoLianWu
  • oYunTaoLianWu
  • 2013年08月27日 00:52
  • 1612

【JavaScript】-原生JavaScript实现Ajax

XHR1级、XHR2级、Ajax的原生代码实现、进度事件
  • XIAOZHUXMEN
  • XIAOZHUXMEN
  • 2016年05月30日 10:43
  • 1916

利用javascript实现原生简单ajax的方法。

利用javascript实现原生简单ajax的方法。  实现ajax之前必须要创建一个 XMLHttpRequest (IE6↑)对象。如果不支持创建该对象的浏览器,则需要创建 ActiveX...
  • linjy520
  • linjy520
  • 2017年03月16日 14:22
  • 237

javascript DOM编程艺术学习笔记(3)Ajax初步认识:

*****Ajax初步认识: 1.Ajax主要用于概括异步加载页面内容的技术; 2.Ajax的主要优势就是对页面的请求以异步方式发送到服务器。而服务器不会用整个页面来响应请求, 他会在后台处理请...
  • u010092682
  • u010092682
  • 2014年04月18日 13:49
  • 664
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:javascript ajax
举报原因:
原因补充:

(最多只允许输入30个字)