全栈---AJAX

前端刷新页面有两种技术:

            整页面刷新  跳转到一个新的网页html

           局部刷新  用js去做网络请求  然后请得到的数据 动态的渲染的DOM

 

 

AJAX技术

                //window.XMLHttpRequest

                //1.创建ajax对象

                let xhr=new XMLHttpRequest()||new ActiveXObject("Micsoft.XMLHTTP")              

                //2.配置连接信息

                xhr.open("GET",`http://192.168.6.60:8080/ajax1?name=karen&count=20`,true)              

                //3.发送网络请求

                xhr.send()              

                //4.等待

                // while(xhr.readyState!=4){                    

                // }

//xhr.readyState!=4当readyState=4时才是后端发回的数据，所以要等待

                xhr.onreadystatechange=function(){

                    console.log(xhr.readyState)

                    if(xhr.readyState==4&&xhr.status==200){

                        console.log(xhr.responseText,11)

                    }else if(xhr.readyState==4&&xhr.status==404){

//当页面显示404时，代表网络请求成功，业务失败

                        console.log(xhr.responseText,22)

                        var obj=JSON.parse(xhr.responseText)

                        console.log(obj)

                    }

                }