ajax同步与异步 理解

时间：2022-02-12 21:25:50

例如，小明去餐馆排队点餐，前台服务员将小明的菜单告诉厨师进行制作，此时小明后面排队的人就一直等着，直到厨师制作完成，把饭菜送到小明手里后离开，后面的人才能继续点餐；这就是同步处理

但是，如果前台服务员将小明的菜单告诉厨师后，服务员发给小明一个好牌去旁边等待，后面的人继续点餐，厨师将小明的饭菜做好后，随时呼唤小明就餐；这就是异步处理

服务器的不同做法，就代表着 Ajax 的同步或异步处理；小明就是客户端；厨师就是后台服务器；

ajax前端代码：
!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

</head>

<body>

    姓名：<input type="text" class="ipt">

    <span id="spa"></span>

</body>

<!-- <script src="./ajax.js"></script> -->

<script>

    //   console.log(window)

    var ipt = document.getElementsByClassName('ipt')

    ipt[0].onblur = function(){

   var xhr = new XMLHttpRequest()

   xhr.onreadystatechange = function(){

       if(xhr.readyState==4){

           if(xhr.responseText==1){

               var s = '<font color="red">不可用</font>'

            document.getElementById('spa').innerHTML=s;

           }else{

            var s = '<font color="red">可用</font>'

            document.getElementById('spa').innerHTML=s;

           }

       }

   }

   xhr.open('post','http://127.0.0.1:8090/gets'，true)//如果什么都不写默认是异步的。//true 异步 //false同步//

 xhr.send('me='+ipt[0].value)

}
</script>

</html>

相关文章