var ajaxTool = {
setting : {
method : 'get',
url : location.href,
data : '',
callback : function(){alert('兄弟,你忘记写回掉函数了吧')}
},
ajax :function(json){
//初始化数据
var This = this
this.extend(this.setting,json); //创建一个xhr对象
var xhr = new XMLHttpRequest(); //格式化数据格式 以字符串键值队的形式传递数据
this.setting.data = this.format(this.setting.data);
//发送请求
if(this.setting.method == 'get'){
this.setting.url += "?" + this.setting.data
this.setting.data = null;
} xhr.open(this.setting.method,this.setting.url,true); if(this.setting.method == 'post'){
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
} //发送请求 xhr.send(this.setting.data) //监听请求状态 xhr.onreadystatechange = function (){
if(xhr.readyState==4&&xhr.status==200){ var result = JSON.stringify(xhr.responseText) //假设请求的是json文件 result = JSON.parse(result); This.setting.callback(result); }
} },
extend :function(obj1,obj2){
for (var attr in obj2) {
obj1[attr] = obj2[attr]
}
},
format : function(data){
var html ="";
for (var attr in data) {
html += attr + '=' + data[attr]+'&';
} html = html.substring(0,html.length-1)
return html;
} }

原生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封装随笔

    XMLHttpRequest 对象用于和服务器交换数据.我们使用 XMLHttpRequest 对象的 open() 和 send() 方法: open(method,url,async) metho ...

  4. 原生ajax封装及用法

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

  5. 原生AJAX封装

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

  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

    原生JavaScript 封装ajax   function myajax(options){ //新建一个局部对象 用来存放用户输入的各种参数 var opt={ type:options.type ...

  9. 使用原生ajax及其简单封装

    原生ajax配置详解 // 原生ajax // 1. 创建ajax对象 if(window.XMLHttpRequest){ // // IE7+, Firefox, Chrome, Opera, S ...

随机推荐

  1. Spring-web中的web.xml为Servlet提供的配置选项说明

    配置Servlet时可以设置的一些初始化参数,总结如下: ContextAttribute: 在ServletContext的属性中,要用作WebApplicationContext的属性名称. Co ...

  2. 《高性能javascript》 --- in case of odd number of items(奇怪的条目的数量)

    不知道是做着故意放的还是什么原因.总之运行后就会出现问题(奇怪的条目的数量) function merge(left, right){ var result = []; while (left.len ...

  3. 通过网络得到html,并解析出其中网址(JAVA程序)

    网络版程序: import java.io.BufferedReader; import java.io.InputStream; import java.io.InputStreamReader; ...

  4. 计蒜客蓝桥杯模拟赛五J. 程序设计:放置守卫

    在一张 n 行 m 列的方格地图上放置一些守卫,每个守卫能守护上.左.右三个方向上相邻的方格和自己所在的方格.如下图,红色的方格放置守卫,绿色的方格为该守卫守护的区域. 现在要求在地图上放置若干个守卫 ...

  5. Java反射机制剖析(三)-简单谈谈动态代理

    通过Java反射机制剖析(一)和Java反射机制剖析(二)的学习,已经对反射有了一定的了解,这一篇通过动态代理的例子来进一步学习反射机制. 1.     代理模式 代理模式就是为其他对象提供一种代理来 ...

  6. OpenCV探索之路(十五):角点检测

    角点检测是计算机视觉系统中用来获取图像特征的一种方法.我们都常说,这幅图像很有特点,但是一问他到底有哪些特点,或者这幅图有哪些特征可以让你一下子就识别出该物体,你可能就说不出来了.其实说图像的特征,你 ...

  7. Cannot be cast to java.lang.Comparable异常

    Set集合中的treeSet问题:cannot be cast to java.lang.Comparable: 原理: Set不保存重复的元素,与Collection类似,只是行为不同,Set是基于 ...

  8. PHP接口学习

    接口:不同类的共同行为进行定义,然后在不同类中实现不同的功能. 接口的具体语法: 接口是零件可以用多个零件组成一个新东西: 接口本身是抽象的,内部申明的方法也是抽象的: 不用加abstract 一个类 ...

  9. 【小练习06】HTML+CSS--教学大讲堂

    要求实现如下效果图: 代码演示 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...

  10. Javascript检测值

    检测原始值用typeof javascript有五种原始类型,分别为字符串.数字.布尔值.null和undefined 判断一个值是什么类型的字符串,可以通过typeof typeof variabl ...