AJAX基础知识笔记

一、AJAX简介

1.1 表单提交

  <form action="01.php" method="post">
      <label for="">请输入用户名</label>
      <input type="text" />
      <label for="">请输入密码</label>
      <input type="passqord" />
      <input type="submit" value="注册" />
    </form>
  </body>

 

1.2 AJAX 

AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。

AJAX 不是新的编程语言，而是一种使用现有标准的新方法。

AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。

二、AJAX基础使用

2.1 get请求

<label for="">请输入用户名</label>
    <input type="text" />
    <label for="">请输入密码</label>
    <input type="passqord" />
    <input type="button" value="注册" id="btn" />
    <div id="box"></div>
    <script>
      // XMLHttpRequest对象 用于在后台与服务器交换数据
      var xml;
      if (window.XMLHttpRequest) {
        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xml = new XMLHttpRequest();
      } else {
        // IE6, IE5 浏览器执行代码
        xml = new ActiveXObject("Microsoft.XMLHTTP");
      }
      //   参数分别是请求方式、请求地址、true是异步 false是同步
      xml.open("GET", "01.php", true); //设置请求的参数
      xml.send(); //发送请求
      xml.onreadystatechange = function() {
        if (xml.readyState == 4 && xml.status == 200) {
          document.getElementById("box").innerHTML = xml.responseText;
        }
      };
    </script>