Ajax知识总结

作者: 赌未来_e1e8 | 来源:发表于2019-06-29 20:04 被阅读0次

流程:

  创建ajax引擎对象

  声明事件监听:监听ajax对象的属性readystate的值,一旦readystate的值发生改变就会触发声明的函数的执行

  ajax的状态码readyState的值:

  0:表示ajax引擎对象创建

  1: 表示请求创建但是未发送 ajax.open("get", "my");

  2: 请求发送ajax.send(null);

  3: 请求处理完毕,正在接收响应状态

  4: 响应内容接收完毕(重要状态)

  ajax响应状态码:ajax.status

  200:表示一切正常

  404:资源未找到

  500:服务器内部错误

  ajax之响应数据

  服务器响应给浏览器的数据应该是字符串类型

  但是如果数据量比较大,我们就需要在服务器端将数据拼接成一个良好格式的字符串数据,响应给浏览器。

  浏览器根据格式进行数据的解析和使用。

  问题:

  什么样的格式算是良好的格式呢?

  解决:

  使用json格式的字符串

  json的概念:

  其实json就是js创建对象的一种格式,保证对象中数据的紧密型和 完整性

  json的格式:

  var 对象名={

  键名:值,

  键名:值,

  键名:值,

  ....

  键名:值

  }

  使用:

  在服务器端将要响应的数据拼接成json格式的字符串,这样客户端(浏览器端)在接收到响应数据后

  可以使用eval方法将json格式的字符串数据直接转化为对应的js对象,便于数据的操作。

  我们可以在服务器使用类似Gson的工具包完成json格式字符串的拼接

  创建并发送ajax请求

  创建ajax请求(设置异步或者同步)

  ajax.open(method,url,ansyc);

  method:表示请求方式

  get方式:请求数据以?隔开的形式拼接在url的后面。

  请求数据不能写在send方法中

  post方式:

  post方式:

  post方式需要单独的进行请求数据的设置。使用ajax.setRequestHeader

  ("Content-Type", "application/x-www-form-urlencoded");

  设置请求数据为键值对数据。如果有请求数据则ajax.send("键值对数据&键值对数据....")

  如果没有请求数据则ajax.send(null)

  url:请求地址

  ansyc:设置异步或同步请求,true表示异步,false,表示同步,默认是异步的。

  异步:

  当前js函数继续执行,无需等待ajax请求的响应以及响应的处理

  同步:

  当前js函数会等待ajax请求以及响应,当ajax响应处理完毕之后,继续执行函数的剩余代码。

  发送ajax请求

  // get方式

  ajax.send(null);

  //post方式

  ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

  ajax.send("uname=zhangbozhi&pwd=123");

  明确流程:

  1.创建ajax对象

  2 。声明监听函数

  //判断ajax状态码

  // 判断响应状态码

  // 处理响应

  3.创建并发送ajax请求

  创建请求(设置请求方式,设置请求地址,设置异步或者同步)

  发送请求

  4. 其他处理

ajax封装

实现:

    思想:相同的保留,不同的传参。

    请求方式:method

    请求方式:url

    请求参数:data 请求参数的格式为键值对格式的字符串,不同的键值对使用&符号隔开,如果没有请求数据传入null

      示例:"a=1&b=2"

    异步同步设置:ansyc

    响应处理参数:deal200

    该参数接受一个js的函数对象,函数对象中声明ajax响应数据的处理逻辑的代码。

    注意:函数对象需要声明一个形参用来接收要处理的响应数据

相关文章

  • Ajax知识总结

    流程: 创建ajax引擎对象 声明事件监听:监听ajax对象的属性readystate的值,一...

  • 前端知识点总结——AJAX

    前端知识点总结——Ajax 1.ajax 2.HTTP协议 2.1请求头 2.2响应(response)消息 2....

  • Ajax总结

    本文主要总结整理Ajax的一些常用的基础知识,适合初学者。 一、Ajax简介、优劣势、应用场景以及技术 Ajax简...

  • Python Flask前后端Ajax交互

    之前总结过flask里的基础知识,现在来总结下flask里的前后端数据交互的知识,这里用的是Ajax 一、 pos...

  • ajax小结

    在平时的开发项目中,难免接触前端的知识,需要写接口,有时候用到js中的ajax跨越请求,总结了ajax的写法。 开...

  • AJAX总结链接

    AJAX总结链接

  • zepto源码分析·ajax模块

    准备知识 在看ajax实现的时候,如果对ajax技术知识不是很懂的话,可以参看下ajax基础,以便读分析时不会那么...

  • Ajax总结

    今天封装了一个简单的ajax。所以顺便总结一下。 #######ajax概念 ajax:Asynchronous ...

  • Ajax使用专题

    参考:ajax总结 原生Ajax level 1 XMLHTTPRequest 属性,方法和事件 XMLHTTPR...

  • ajax小结

    在开发过程中ajax是必须的,对近期在ajax的使用上的心得进行总结。 一、关于ajax AJAX = Async...

网友评论

    本文标题:Ajax知识总结

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