function ajax(method,url,data,fn){
// 1、创建对象
var xhr=null;
try{
xhr=new XMLHttpRequest();
}catch(e){
xhr=new ActiveXObject("Microsoft.XMLHTTP");
} // 2、open方法
if(method=="get"&&data){
url=url+"?"+data;
}
xhr.open(method,url,true); // 3、send方法
if(method=="get"){
xhr.send()
}else{
// post请求时执行
// 声明发送的数据类型
xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');
xhr.send(data);
} // 4、接收数据
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if (xhr.status==200) {
// 数据接收成功后执行传来的函数
fn(xhr.responseText)
}else{
alert("错误"+xhr.status)
}
}
}
} 注:function ajax(method,url,data,fn){}
method----方法
url---路径
data---数据,不用传数据时,函数传该参数""
fn---数据接收成功后执行传来的函数

原生js---ajax的封装插件.js---(对get和post做了兼容)的更多相关文章

  1. 用js面向对象思想封装插件

    js是基于原型的面向对象语言,如果你学过java,c#等正统面向对象语言,你会难以理解js的面向对象,他和普通的面向对象不太一样,今天,我们通过封装一个toast插件,来看看js面向对象是如何运行的. ...

  2. 个人对js面向对象和封装插件的用法

    做了一段时间的前端了,给自己写代码也总结出来了一点小小的思路,就来分享一下自己的意见和建议了. 面向对象和插件封装其实说到底都是面向对象的思想,但是插件一般是你要用的时候就new 调用出来的.就说一下 ...

  3. Node.js的高性能封装 Express.js

    Express 是一个简洁而灵活的 node.js Web应用框架, 提供一系列强大特性帮助你创建各种Web应用.Express 不对 node.js 已有的特性进行二次抽象,我们只是在它之上扩展了W ...

  4. js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用)

    js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用) 一.总结 2.匿名函数作为参数传递 二.js进阶ajax函数封装 ajax1.js function ajax(ur ...

  5. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  6. 最详细的原生js实现ajax的封装

    1. ajax的介绍 1.1 含义 ajax 的全称是Asynchronous JavaScript and XML 简单理解下:ajax就是异步的js和服务端的数据 1.2 组成 异步的js:事件, ...

  7. 原生js ajax 封装

    首先我们先了解ajax的get和post请求分别是怎样请求数据的 get请求 let ajx = new XMLHttpRequest() //创建ajax实例 /*打开需要请求的地址,可以有三个参数 ...

  8. 【转】3篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:官方原生方法分析

    作者: 牛A与牛C之间 时间: 2013-11-17 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第3篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  9. 原生JS面向对象思想封装轮播图组件

    原生JS面向对象思想封装轮播图组件 在前端页面开发过程中,页面中的轮播图特效很常见,因此我就想封装一个自己的原生JS的轮播图组件.有了这个需求就开始着手准备了,代码当然是以简洁为目标,轮播图的各个功能 ...

随机推荐

  1. MVC 实用架构设计(〇)——总体设计

    〇.目录 一.前言 二.结构图 三.结构说明 一.前言 一直以来都想写这个系列,但基于各种理由(主要是懒惰),迟迟没有动手.今天,趁着周末的空档,终于把系列的目录公布出来了,算是开个头,也给自己一个坚 ...

  2. ARCSDE直连Oracle时出现错误Failed to connect to the specified server. Underlying DBMS error[ORA-12154: TNS:could not resolve the connect identifier specified. No extended error]

    买了新笔记本,装软件. 在ARCSDE直连Oracle时遇到问题. esri官网给的解释是因为安装arcgis时安装目录里有特殊字符(详见:https://support.esri.com/en/te ...

  3. PHP之魔术引号

    什么是魔术引号 Warning 本特性已自 PHP5.3.0起废弃并将自PHP5.4.0起移除. 当打开,所有的'(单引号),"(双引号),  (反斜线)和NULL 字符都会被自动加上一个反 ...

  4. cocos2dx 粒子系统

    参考文献: 1.http://blog.csdn.net/aa4790139/article/details/8126525 2.https://code.google.com/p/cocos2d-w ...

  5. 图->连通性->最小生成树(普里姆算法)

    文字描述 用连通网来表示n个城市及n个城市间可能设置的通信线路,其中网的顶点表示城市,边表示两城市之间的线路,赋于边的权值表示相应的代价.对于n个定点的连通网可以建立许多不同的生成树,每一棵生成树都可 ...

  6. navicat连接oracle失败

    正常是成功的,失败的话,就是oci.dll的问题 在这边下载: https://www.oracle.com/technetwork/topics/winsoft-085727.html 然后找到对应 ...

  7. pillow与numpy实现图片素描化

    from PIL import Image import numpy as np #封装一个图像处理类 class TestNumpy(object): def photo2paint(self,im ...

  8. Java如何对List集合的操作方法(一)

    目录: list中添加,获取,删除元素: list中是否包含某个元素: list中根据索引将元素数值改变(替换): list中查看(判断)元素的索引: 根据元素索引位置进行的判断: 利用list中索引 ...

  9. Java如何连接SQLServer,并实现查询、修改、删除方法

    场景:A:在UI自动化时,删除数据时候,在界面UI提示“该XX已被使用,无法删除”. 这时候我们有需要做数据初始化的操作,需要把历史数据做删除,来确脚本运行的重复执行,和稳定性质. B: 在做新增操作 ...

  10. 离线应用与客户端存储(cookie storage indexedDB)

    离线检测 HTML5定义一个属性:navigator.onLine的属性.这个属性值为true,表示设备在线,值为false,表示设备离线.为了更好的确定网络是否可用,HTML5还定义了两个事件.这两 ...