ajax发送请求

首先创建XMLHttpRequest对象，利用此对象发送请求

主页面

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>使用Ajax</title>

<script type="text/javascript">
function vote(){
    //XmlHttpRequest对象，一个专门的HTTP请求工具
    /*
    实现Ajax要考虑的内容：
    1，用什么请求方式
    2，请求哪个资源(url)
    3，同步还是异步
    */
    var xhr=new XMLHttpRequest();
    // document.write(xhr);


    // alert(xhr);
    // console.log(xhr);//在IE10以下版本console未定义

    //单向请求
    xhr.open('GET','./01.php',true);//打开连接
    //请求方法，请求地址，同步还是异步

    xhr.send(null);//发送请求，不发送数据

    alert(xhr.responseText);
    alert("hello");
    
}
</script>
</head>
<body>
    <form action="" method="post">
        <p>用户名:<input type="text" name="username"/></p>
        <p>密码:<input type="password" name="pwd"/></p>
        <p><input type="submit" value="注册" onclick="vote()"/></p>
    </form>
</body>
</html>

返回值为01.php中echo的内容

同步与异步的理解

等待send()执行完毕之后，再执行后面的语句为同步  false
不等带send()的是否执行，直接执行后面的语句为异步 true

xhr对象在请求和响应过程中，状态会不断变化，1-4逐步变化，到4时，表示成功
可以绑定一个函数，来监听状态的改变，最终实现接收最后响应信息

添加以下代码，用异步传输

//状态变化的回调函数
    xhr.onreadystatechange=function(){
        if(xhr.readyState==4){
            alert("请求成功了");
            alert(xhr.responseText);//弹出返回信息,responseText是属性不是方法
        }
    }