美文网首页
JS AJAX实现步骤口述整理

JS AJAX实现步骤口述整理

作者: 史梦辰 | 来源:发表于2018-12-05 16:15 被阅读0次

第一步

创建XMLHttpRequest对象,需要兼容IE7之前的版本,

通过判断浏览器是否支持ActiveX控件来实现。

var xhr=new XMLHttpRequest();

第二步

在异步请求时设置onreadystatechange事件处理程序。
检查readyState属性的值来实现,其中值为4时,表示已经接收到全部的响应数据,并且可以在客户端使用了。接着判断status状态码,判断响应是否成功来进行下面的步骤。其中responseText 获得字符串形式的响应数据,responseXML获取xml形式的相应数据。

第三步

使用open方法与服务器建立连接。
open方法包含三个参数,第一个是请求方法,有get和post两种,如果是post方法,要在设置头部的content-type字段,第二个是url地址,有相对和绝对地址,第三个是一个布尔值,表示是否是异步请求,其中true表示异步。异步表示在send()方法之后,浏览器继续执行,而不等待服务器的响应。

第四步

向服务其发送数据。
xhr.send(null);其中post方法参数不为空。

第五步

使用javascript和dom实现局部刷新。

相关文章

  • JS AJAX实现步骤口述整理

    第一步 创建XMLHttpRequest对象,需要兼容IE7之前的版本, 通过判断浏览器是否支持ActiveX控件...

  • 札记丶20171016

    请假回家了几天,好累。。。 今日整理 1.JS变量 实现效果: 实现步骤: 2.JS实现 实现效果: 实现步骤: ...

  • 一份头条前端面试准备[整理稿]

    JS打乱数组 JS ajax JS bind 实现 懒加载 JS实现promise JS发布订阅模式 JSONP ...

  • Ajax和跨域总结

    Ajax(JavaScript实现) 简介 Ajax(Async Javascript And Xml):异步Js...

  • 原生js实现Ajax

    如果要用原生的JS实现Ajax怎么整呢,让我们一起来整一个试试。 方法: /** 详细说明: 1.Ajax步骤:1...

  • AJAX POST请求实现/AJAX封装/node/RESTfu

    AJAX POST请求实现 AJAX封装 JSONP node.js 扩展

  • 原生js实现Ajax

    原生js实现Ajax方法:var Ajax={get: function(url, fn) { var xhr =...

  • AJAX

    ajax XMLHTTpRequest对象是Ajax的核心,XMLHTTpRequest对象使得js脚本能够实现对...

  • 三、原生JS发送Ajax请求

    一、Ajax实现步骤 使用Ajax技术实现异步交互: 创建XMLHttpRequest对象(根据浏览器的不同创建方...

  • 原生js实现ajax及get post方法

    @拭目以待:首发于原生js实现ajax及get post方法 ajax原生实现,含 post与get方法。原码如下...

网友评论

      本文标题:JS AJAX实现步骤口述整理

      本文链接:https://www.haomeiwen.com/subject/lxdwcqtx.html