XMLHttpRequest 对象用于和服务器交换数据。我们使用 XMLHttpRequest 对象的 open() 和 send() 方法:

open(method,url,async)

method:请求的类型;GET 或 POST

url:文件在服务器上的位置

async:true(异步)或 false(同步)

send(string)

string:仅用于 POST 请求

注:如果需要像 HTML 表单那样 POST 数据,需设置 setRequestHeader() 来添加 HTTP 头,然后在 send() 方法中规定您希望发送的数据:XMLHttpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");示例如下代码58行所示。

 var Factory = {
create: function() {
return function() { this.init.apply(this, arguments); }
}
} var Ajax = Factory.create(); Ajax.prototype = {
init: function (successCallback, failureCallback) {
this.xhr = this.createXMLHttpRequest();
var xhrTemp = this.xhr;
var successFunc = null;
var failFunc = null; if (successCallback != null && typeof successCallback == "function") {
successFunc = successCallback;
} if (failureCallback != null && typeof failureCallback == "function") {
failFunc = failureCallback;
} this.get.apply(this, arguments);
this.post.apply(this, arguments); this.xhr.onreadystatechange = function () {
if (xhrTemp.readyState == ) {
if (xhrTemp.status == ) {
if (successFunc != null) {
successFunc(xhrTemp.responseText, xhrTemp.responseXML);
}
}
else {
if (failFunc != null) {
failFunc(xhrTemp.status);
}
}
}
}
},
get: function (url, async) {
this.xhr.open("GET", url, async);
this.xhr.send();
},
createXMLHttpRequest: function () {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
else {
return new ActiveXObject("Microsoft.XMLHTTP");
} throw new Error("Ajax is not supported by the browser!");
},
post: function (url, data, async) {
this.xhr.open("POST", url, async);
this.xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
this.xhr.send(data);
},
random: function (length) {
var array = new Array("", "", "", "", "", "", "", "", "");
var len = parseInt(length);
var key = ""; for (var i = ; i < len; i++) {
key += Math.floor(Math.random() * );
} return key;
}
}

对于GET与POST方法使用如下:

       function get() {
var ajax = new Ajax(success,fail);
ajax.get("Scripts/Util.js", true);
} function post() {
var ajax = new Ajax(success, fail);
ajax.post("AjaxService.asmx/GetArgs","name=jasen", true);
} function success(responseText, responseXML) {
alert("result:" + responseText);
} function fail(status) {
alert("status:" + status);
}

以上仅为练习随笔,仅供参考....

原生Ajax封装随笔的更多相关文章

  1. 原生ajax封装,包含post、method方式

    原生ajax封装,包含post.method方式 function ajax(method, url, data, success) { var xhr = null; try { xhr = new ...

  2. 原生 Ajax 封装 和 Axios 二次 封装

    AJAX 异步的JavaScript与XML技术( Asynchronous JavaScript and XML ) Ajax 不需要任何浏览器插件,能在不更新整个页面的前提下维护数据,但需要用户允 ...

  3. 原生ajax封装及用法

    /* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @ ...

  4. 原生AJAX封装

    var ajaxHelper = { /*1.0 浏览器兼容的方式创建异步对象*/ makeXHR: function () { //声明异步对象变量 var xmlHttp = false; //声 ...

  5. 原生ajax封装,数据初始化,

    var ajaxTool = { setting : { method : 'get', url : location.href, data : '', callback : function(){a ...

  6. 原生js封装ajax:传json,str,excel文件上传表单提交

    由于项目中需要在提交ajax前设置header信息,jquery的ajax实现不了,我们自己封装几个常用的ajax方法. jQuery的ajax普通封装 var ajaxFn = function(u ...

  7. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  8. 原生javascript封装ajax和jsonp

    在我们请求数据时,完成页面跨域,利用原生JS封装的ajax和jsonp: <!DOCTYPE html> <html lang="en"> <head ...

  9. js原生Ajax的封装与使用

    一.原生Ajax代码的封装如下: (function() { var XHR = { createStandardXHR: function() { return new XMLHttpRequest ...

随机推荐

  1. C#(asp.net )读取ASHX文件(一般处理程序)

    c#后台获取asxh的返回数据,后台创建一个请求实例,获取请求实例的返回值 public string GetResponseByPost(string apiUrl, string queryStr ...

  2. windows 下ssh 客户端

    今天用 xshell 和 bitvise ssh 在 windows 登录SSH ,发现 vi 一些中文内容的文件会出现乱码,配置无效,在网上找到一款不会中文乱码的SSH客户端 MobaXterm , ...

  3. 基于AWS的云服务架构最佳实践

    ZZ from: http://blog.csdn.net/wireless_com/article/details/43305701 近年来,对于打造高度可扩展的应用程序,软件架构师们挖掘了若干相关 ...

  4. java: R文件重复

    导入eclipse工程到intellij里面, 然后出现各种错误, xxx.R文件重复, 各种资源id在R文件中找不到, 后来发现是intellij默认将整个项目以及gen文件夹作为源代码目录了, 在 ...

  5. MongoDB GridFS 对图片进行增删改

    using MongoDB.Bson; using MongoDB.Driver; using MongoDB.Driver.Builders; using MongoDB.Driver.GridFS ...

  6. [C#.net]PostMessage与SendMessage的区别

    用 PostMessage.SendNotifyMessage.SendMessageCallback 等异步函数发送系统消息时,参数里不可以使用指针,因为发送者并不等待消息的处理就返回,接受者还没处 ...

  7. [WPF]建立自适应窗口大小布局的WinForm窗口

    编写WinForm程序时,都会碰到一个问题.就是WinForm窗口在不同分辨率下的大小问题.举例说明,你编写的WinForm窗口在1024×768下是合适.匀称的.不过,如果用户的计算机的分辨率为14 ...

  8. Android PowerImageView实现,可以播放动画的强大ImageView

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/11100315 我个人是比较喜欢逛贴吧的,贴吧里总是会有很多搞笑的动态图片,经常看一 ...

  9. 使用nginx为ArcGIS Server做反向代理

    1.下载nginx软件:官网地址http://nginx.org/ 2.修改conf文件夹下nginx.conf配置信息, 配置文件中以下内容: server { listen       80; s ...

  10. Linux 将文件夹下的所有文件复制到另一个文件里

    如何将文件夹/home/work下的文件复制到/home/temp里面? 使用命令: cp -R /home/work/* /home/temp *表示所有文件 但是/home/work 下的隐藏文件 ...