多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
# get请求 页面存在的link href等都是属于get请求 ***** ``` <button id="btn">点击按钮发送get请求 ajax</button> <div id="aa"></div> <script> let btnObj = document.getElementById("btn"); let aObj = document.getElementById("aa"); btnObj.onclick = function () { // 1.创建ajax对象 let ajax = new XMLHttpRequest();//对象初始化 状态为0 // 2.设置请求路径和请求方式 ajax.open("get", "/get_data");//载入,AJAX 对象开始发送请求,状态为1 // 3.绑定监听状态改变的处理函数,在处理函数中可以获取响应数据 ajax.onreadystatechange = () => { // 获取ajax对象的状态变化 console.log(ajax.readyState);//2 3 4 前面发生的两个状态发生的时候代码还没有执行到这 // 只有当状态码等于200 同时状态值等于4时,才能获取服务器响应回来的数据 if (ajax.readyState === 4 && ajax.status === 200) { //ajax.responseText 获取服务器响应回来的数据 // 将从服务器获取到的数据渲染到浏览器中 aObj.innerText = ajax.responseText; } }; //避免缓存堵塞 ajax.setRequestHeader('Cache-Control', 'no-cache'); // 4.发送请求 ajax.send(); } </script> <!--步骤--> <!--1.在发出请求的页面,发出请求 2.在服务器端,编写改请求的响应方法(响应内容) --> ``` ***** **服务端代码** ``` if(/get_data.*/.test(requestUrl)){ //请求的路径可能会不一样,所以用正则表示 response.setHeader("Content-type","text/html;charset=utf-8"); response.write("这是服务器传来的数据"); response.end(); } ```