zoukankan      html  css  js  c++  java
  • Ajax——请求

    一,向服务器发送请求

      如果需要发送请求,可以使用XMLHttpRequest对像的open()和send(),open()用来规则请求,send()用来发送请求。

    方法 描叙
    open(Method,url,async,user,pws)

    规定请求的类型:

      method:请求的方式get或者post

      url:服务器(文件的位置)

      async:true或者false

      user:用户

      psw:密码

    send() 发送get请求
    send(String ) 向服务器发送post请求

      

    get请求和post请求

    • get请求比Post请求更快,不过在以下情况下使用post请求:
    • 缓存的文件不是选项(是文件或者数据库)
    • 向服务器发送大量的数据
    • 发送用户输入的(post比get安全)

    get请求:

       普通的get请求:

    xhttp.open("GET", "demo_get.asp", true);
    xhttp.send();

      也可以添加一个字段:

    xhttp.open("GET", "demo_get.asp?t=" + Math.random(), true);
    xhttp.send();

      如果需要使用get请求来发送数据,数据应该放在url上,如

    xhttp.open("GET", "demo_get2.asp?fname=Bill&lname=Gates", true);
    xhttp.send();

    post请求:

      简单的post请求:

    xhttp.open("POST", "demo_post.asp", true);
    xhttp.send();

      如果需要向html那样post数据,请通过 setRequestHeader() 添加一个 HTTP 头部。请在 send() 方法中规定您需要发送的数据:

    xhttp.open("POST", "ajax_test.asp", true);
    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhttp.send("fname=Bill&lname=Gates");

      setRequestHeader(header,value)方法:

      header:规定的头部名称

      value:规定的头部值

     

    二,服务器响应

    onreadystatechange属性:

      readyState 属性存留 XMLHttpRequest 的状态。

      onreadystatechange 属性定义当 readyState 发生变化时执行的函数

      status 属性和 statusText 属性存有 XMLHttpRequest 对象的状态。

      每当readyState的值发生改变时候都会调用onreadyStateChange

    使用回调函数:(当readyState为4,status为200时候表示响应就绪

      回调函数就是一种作为参数被传递到另一个函数的函数。

      如果您的网站中有多个 AJAX 任务,那么您应该创建一个执行 XMLHttpRequest 对象的函数,以及一个供每个 AJAX 任务的回调函数。

      该函数应当包含 URL 以及响应就绪时调用的函数

    <!DOCTYPE html>
    <html>
    <body>
    
    <div id="demo">
    
    <h1>XMLHttpRequest 对象</h1>
    //调用方法,并且传递请求的路径,和回调函数
    <button type="button" onclick="loadDoc('/example/js/ajax_info.txt', myFunction)">更改内容
    </button>
    </div>
    
    <script>
    //创建一个函数,参数一位请求的地址,参数二为回调函数
    function loadDoc(url, cFunction) {
      //创建一个请求对象
      var xhttp;
      xhttp=new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
          //当响应就绪时调用回调函数
        if (this.readyState == 4 && this.status == 200) {
          cFunction(this);
        }
      };
      xhttp.open("GET", url, true);
      xhttp.send();
    }
    
    function myFunction(xhttp) {
      //responseText属性是将返回的数据以文本形式显示
      document.getElementById("demo").innerHTML =
      xhttp.responseText;
    }
    </script>
    </body>
    </html>

    服务器响应的属性:(XMLHttpRequest对象的属性)

      responseText:获取字符串形式的响应数据

      responseXML:获取XML数据形式的响应数据

    服务器响应的方法:(XMLHttpRequset对象的方法)

      getResponseHeader(String headerName):从服务器返回的特定的头部信息

      getAllResponseHeaders():从服务器返回所有的头部信息

  • 相关阅读:
    机器学习(04)——常用专业术语
    C# 线程同步的三类情景
    线程同步的情景之三
    线程同步的情景之二
    线程同步的情景之一
    Thread.Sleep(0) vs Sleep(1) vs Yeild
    Visual Studio 实用扩展推荐
    为革命保护视力 --- 给 Visual Studio 换颜色
    免费的精品: Productivity Power Tools 动画演示
    如何扩展 Visual Studio 编辑器
  • 原文地址:https://www.cnblogs.com/zhilili/p/12786684.html
Copyright © 2011-2022 走看看