ajax入门

Ajax

异步对象:

var xmlHttpRequest = new XMLHttpRequest();

ajaxsaynchronous js and xml

步骤

  1. 创建异步对象

    var xmlHttpRequest = new XMLHttpRequest();

  2. 给异步对象绑定事件

    onreadystatechange:当异步对象发起请求,获取了数据都会触发这个事件,这个事件需要指定一个函数,在函数中处理状态的变化。

    例如:xmlHttpRequest.onreadystatechange = function() {处理请求的状态变化}

    onreadystatechange属性:一个js函数名或直接定义函数,每当readyState的属性改变时,就会调用该函数

    readyState属性:存在XMLHttpRequest的状态,从0到4发生变化。

    • 0: 请求未初始化,创建异步请求对象 var xmlHttpRequest = new XMLHttpRequest();
    • 1: 初始化异步请求对象,xmlHttp.open(请求方式,请求地址,true);
    • 2: 异步对象发送请求,xmlHttpRequest.send()
    • 3: 异步对象接收应答数据(从服务器段返回的数据),xmlHttpRequest内部处理
    • 4: 异步对象已经将数据解析完毕,此时才可以读取数据。开发人员在此时处理数据。开发人员在这时进行页面的更新。

    status属性:表示网络的状况。常见有200,404,500...当status === 200时,表示网络的请求成功。

  3. 初始化异步请求对象

    异步的方法为open()

    xmlHttpRequest.open("请求的方式get/post","请求的服务器访问地址",true(表示发送的请求为异步请求,默认值)/false(表示发送的请求为同步请求))

  4. 使用异步对象发送请求

    xmlHttpRequest.send()

获取服务器端返回的数据,使用异步对象的属性xmlHttpRequest.responseText

向后端传送数据

xmlHttpRequest.send()方法中加入需要传入的参数即可。

获得后端发送的数据

通过xmlHttpRequest.responseText就可以获得后端发送的数据

如果后端发送的数据为json类型的,可以通过下面两种方式将后端传入的数据转为json类型

  1. var json =eval("(" + xmlHttpRequest.responseText + ")") ;

    然后就可以使用获得的json对象,通过.属性名的方式就可以获得相关的属性

  2. var json = JSON.parse(xmlHttpRequest.responseText);

两种方法的区别是第二种方法在解析json数据时会对其进行格式的检查,如果不正确就不进行解析。而第一种方法可以解析任何的字符串,是不安全的。推荐使用第二种解析json数据的方法。

posted @   吃心王  阅读(25)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单,K8s 太复杂?w7panel 让容器管理更轻松!
历史上的今天:
2021-03-10 RISC / CISC
点击右上角即可分享
微信分享提示