• Ajax相关


    1.首先创建Ajax请求对象,即XMLHttpRequest对象,大多数浏览器都内建了该对象,当然大多数一般和IE6关系不大,所以针对这一点,再获得该对象时,需要做一些处理:

    1 var xmlhttp;
    2 if (window.XMLHttpRequest)
    3   {// code for IE7+, Firefox, Chrome, Opera, Safari
    4   xmlhttp=new XMLHttpRequest();
    5   }
    6 else
    7   {// code for IE6, IE5
    8   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    9   }

    2.发送请求需要用到的方法。

    方法描述
    open(method,url,async)

    规定请求的类型、URL 以及是否异步处理请求。

    • method:请求的类型;GET 或 POST
    • url:文件在服务器上的位置
    • async:true(异步)或 false(同步)
    send(string)

    将请求发送到服务器。

    • string:仅用于 POST 请求

    open->method:可选参数为“GET”和“POST”

        GET:请求简单,快速。但不能发送较大的数据。

           携带数据时,与平时的其它的get请求格式一致。

        POST:1.不希望使用缓存数据时建议使用

             2.发送较大的数据时建议使用

             3.安全性较get方法好

                    4.post数据可为空,若有数据,则在将数据以字符串形式传入send()方法,格式为"名1=值1&名2=值2”"。

    open->async:可选参数为"true"和“false”

     var xmlhttp;
                if (window.XMLHttpRequest)
                {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                xmlhttp.onreadystatechange=function()
                {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                        document.getElementById("txt").innerHTML=xmlhttp.responseText;
                    }
                }
                xmlhttp.open("GET","text.txt",false);
                xmlhttp.send();
                 alert("ok");

       

         以上示例代码中,当open->async设置为false时,弹窗消息“ok”一般都会在响应文本显示之前,当其设置为true后,弹窗消息一定会在响应文本显示之后,

    也就是说,设置为true后会阻塞javascript的脚本继续往下执行,需要等到请求响应完成,才继续往下执行,而设置为false,javascript会在等待服务器响应数据

    的同时,继续执行代码。

    3.需要添加响应头,需要用到以下方法:

    方法描述
    setRequestHeader(header,value)

    向请求添加 HTTP 头。

    • header: 规定头的名称
    • value: 规定头的值

    4.服务器响应属性:

    属性描述
    responseText 获得字符串形式的响应数据。
    responseXML 获得 XML 形式的响应数据。

    5.当请求被发送到服务器时,我们需要执行一些基于响应的任务。

    每当 readyState 改变时,就会触发 onreadystatechange 事件。

    readyState 属性存有 XMLHttpRequest 的状态信息。

    属性描述
    onreadystatechange 存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。
    readyState

    存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。

    • 0: 请求未初始化,未初始化,尚未调用open()方法。
    • 1: 服务器连接已建立,启动,尚未调用send()方法。
    • 2: 请求已接收,已发送,但未收到。
    • 3: 请求处理中,接收数据,已收到部分数据。  
    • 4: 请求已完成,且响应已就绪,收到全部响应数据。
    status

    200: "OK"

    404: 未找到页面

    304:浏览器缓存数据,数据并未修改

     

     

     

     

     

     

    参考:http://www.w3school.com.cn/ajax/index.asp

  • 相关阅读:
    with admin option 和 with grant option 的区别 (转)
    压缩数据块
    建表时pctfree和pctused参数作用
    Oracle哪些错误会写进alert日志
    Oracle 差异、增量、零级备份
    模拟原生的promise
    react-loadable 实现组件按需加载
    react 中配置 http-proxy-middleware
    craco 配置 less.module
    ESLint: 'React' was used before it was defined.(no-use-before-define)
  • 原文地址:https://www.cnblogs.com/xiaozweb/p/3818046.html
Copyright © 2020-2023  润新知