zoukankan      html  css  js  c++  java
  • AJAX其实就是一个异步网络请求

    AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。其实就是一个异步网络请求。

    一、创建对象

    var xmlhttp;
    if (window.XMLHttpRequest)
    {
        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    

    二、API调用

    1 有open() 和 send() 两个方法:

    • open(method,url,async) 规定请求的类型、URL 以及是否异步处理请求。
      • method:请求的类型;GET 或 POST
      • url:文件在服务器上的位置
      • async:true(异步)或 false(同步)
    • send(string) 将请求发送到服务器。
      • string:仅用于 POST 请求
    xmlhttp.open("GET","ajax_info.txt",true);
    xmlhttp.send();
    

    2 响应

    • responseText 获得字符串形式的响应数据。
    • responseXML 获得 XML 形式的响应数据。

    3 readyState

    当请求被发送到服务器时,我们需要执行一些基于响应的任务。每当 readyState 改变时,就会触发 onreadystatechange 事件。

    • onreadystatechange 存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。
    • readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
      • 0: 请求未初始化
      • 1: 服务器连接已建立
      • 2: 请求已接收
      • 3: 请求处理中
      • 4: 请求已完成,且响应已就绪

    4 status

    • 200: "OK"
    • 404: 未找到页面
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
    }
    
  • 相关阅读:
    react的CSS中 :global的含义
    TypeScript中的问号 ? 与感叹号 ! 的含义
    移动端1px问题的解决方案
    原生js实现call,apply以及bind
    哪些场景不能使用箭头函数
    线性渐变、径向渐变以及圆锥渐变
    vue 开发中实现provide和inject实现依赖注入
    inline-block元素去除间隙
    clientWidth、offsetWidth、scrollWidth的区别
    session、token和cookie
  • 原文地址:https://www.cnblogs.com/diffx/p/9439329.html
Copyright © 2011-2022 走看看