1、首先创建一个js文件夹名为common.js、创建一个createXhr()的函数、在此方法中创建异步对象XMLHttpRequest,后面使用的时候直接引入common.js文件,然后进行调用就行了。

function createXhr(){
var xhr=null;
if(window.XMLHttpRequest){//判断浏览器是否支持标准创建
xhr=new XMLHttpRequest();//如果支持返回一个xhr对象
}else{
//如果不支持标准创建,返回一个ie8以下的异步对象
xhr=new ActiveXObject('Microsoft.XMLHttp')
}
return xhr;
}

2、绑定监听事件

xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.Status==200){
var result=xhr.responseText;
}
}

3、创建请求,打开链接

xhr.open(get,url,true);//设置请求方式和请求路径
//post方式要设置请求头
xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded")

4、发送请求

xhr.send(body);
createXhr

Ajax原生四大步骤的更多相关文章

  1. javascript中ajax的四大步骤

    原生js中ajax写法一: function ajaxys(){ //1. 创建xhr对象 var xhr = new XMLHttpRequest();//XMLHttpRequest() // 2 ...

  2. Ajax 基本使用的四大步骤,简单易懂

    ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页.接下来通过本文给大家介绍Ajax的使用四大步骤,非常不错,感兴趣的朋友看下吧 什么是ajax? ajax(异步 ...

  3. Ajax原生写法

    用太久JQuery了,别忘了Ajax原生是怎么写的 var Ajax = { get : function (url, callback) { var req = Ajax.getRequest(ca ...

  4. HTML5+AJAX原生分块上传文件的关键参数设置

    processData:false 这是jquery.ajax的一个参数.默认值为true,表示会将非字符串对象自动变成k1=v1&k2=v2的形式,例如一个数组参数{d:[1,2]},到服务 ...

  5. Ajax原生请求和java对象转成json

    \黑马程序员_超全面的JavaWeb视频教程vedio\黑马程序员_超全面的JavaWeb教程-源码笔记\JavaWeb视频教程_day23-资料源码\ajax_code\day23_3 本代码中有模 ...

  6. 实现AJAX的基本步骤

    实现AJAX的基本步骤 要完整实现一个AJAX异步调用和局部刷新,通常需要以下几个步骤: (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象. (2)创建一个新的HTTP请求,并指 ...

  7. JavaScript AJAX原生写法

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  8. C#构造方法(函数) C#方法重载 C#字段和属性 MUI实现上拉加载和下拉刷新 SVN常用功能介绍(二) SVN常用功能介绍(一) ASP.NET常用内置对象之——Server sql server——子查询 C#接口 字符串的本质 AJAX原生JavaScript写法

    C#构造方法(函数)   一.概括 1.通常创建一个对象的方法如图: 通过  Student tom = new Student(); 创建tom对象,这种创建实例的形式被称为构造方法. 简述:用来初 ...

  9. 实现AJAX的基本步骤 。。转

    要完整实现一个AJAX异步调用和局部刷新,通常需要以下几个步骤: (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象. (2)创建一个新的HTTP请求,并指定该HTTP请求的方法. ...

随机推荐

  1. 二、Blender/Python API总览

    原文:https://docs.blender.org/api/blender_python_api_current/info_overview.html Python in Blender  Ble ...

  2. Tensorflow函数——tf.variable_scope()

    Tensorflow函数——tf.variable_scope()详解 https://blog.csdn.net/yuan0061/article/details/80576703 2018年06月 ...

  3. String int 相互转换

    String->int: int i = Integer.parseInt(s) int->String: String s = Integer.toString(i)

  4. monobehaviour生命周期完整版

  5. http://ctf.bugku.com/challenges#Timer(%E9%98%BF%E9%87%8CCTF):Bugku——Timer(阿里CTF)

      做了第一个android apk逆向题,很多工具啥的还没用过,再接再厉.   找到方法发现这个apk支持的SDK API是15-17,于是就下载了API 16并制作了模拟器,但发现还是运行不起来, ...

  6. http://www.bugku.com:Bugku——备份是个好习惯(http://120.24.86.145:8002/web16/)

      看了bugku的这道题,陌生又熟悉.     题目首先说[备份是个好习惯],访问网站只有一串字符,,,,,emmmmm,这句话表明人家经常做备份,所以咯,肯定在网站哪里备份有网页信息.嘻嘻   1 ...

  7. windows安装ssh工具opensssh

    本篇教程将告诉你如何在Windows 10设备上启用SSH,让您可以通过命令提示符连接到远程服务器 工具/原料   首先你需要下载windows版本的OpenSSH, 本教程以7.2p1-1版本为例 ...

  8. wheelView实现滚动选择 三方开源的封装控件 spannableString autofitTextView、PinnedSectionListView SwipeListView等等

    wheelView多用于popupwindow用来滚动选择条目 github上的开源三方控件     spannableString   autofitTextView.PinnedSectionLi ...

  9. (五)ROS节点

    一. 理解ROS 节点: ROS的节点: 可以说是一个可运行的程序.当然这个程序可不简单.因为它可以接受来自ROS网络上其他可运行程序的输出信息,也可以发送信息给ROS网络,被其他 ROS 可运行程序 ...

  10. 【C++】:STL迭代器使用---[容器::iterator iter;]

    参考文章:http://blog.csdn.net/qq_23100787/article/details/51388163 迭代器这种东西,就是为了使访问简单!! 容器::iterator iter ...