XMLHTTPRequest对象的基本使用 · 学习AJAX

[TOC] >[success] # 请求报文和响应报文基本概念 <br/> >[success] ## 前端代码 <br/> index.html <br/> ~~~ <!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> <script> window.onload = function(){ // 绑定点击事件 document.querySelector('input').onclick = function(){ // 创建对象: 异步对象 var xhr = new XMLHttpRequest(); // 请求行 xhr.open('get','xxx.php'); // 请求头 setRequestHeader,Cookie就是加在请求头里面的 // 参数1 键名 // 参数2 值 xhr.setRequestHeader('aoligei','hahahah') // 请求主体发送 xhr.send(null) } } </script> </head> <body> <input type="button" value="发送请求报文"> </body> </html> ~~~ <br/> >[success] ## 后台接口代码 <br/> xxx.php <br/> ~~~ <?php echo '你来了阿'; ?> ~~~ <br/> >[success] ## 浏览器Network显示结果 <br/> ![](https://img.kancloud.cn/00/40/00400d4147af63e0f3c1141d69346806_1371x642.png) <br/> ![](https://img.kancloud.cn/6c/97/6c97ee9b7e0e41cc58bdfafb5d226d46_1335x614.png)