index.html文件
<!DOCTYPE html>
<html>
<head>
<title>title</title>
<meta charset="UTF-8">
</head>
<body>
<h2>点击的时候的发送请求报文 --不刷新页面</h2>
<input type="button" value='发送请求报文'>
<h3></h3>
</body>
</html>
<script type="text/javascript">
//点击事件
document.querySelector('input').onclick = function(){
//1.创建对象
var xhr = new XMLHttpRequest();
//2.设置请求行(get请求数据写在url后面)
xhr.open('get','getDate.php?name=kafeimao&skill=eat');
//3设置请求头(get请求可以省略,post不发送数据也可以省略)
//xhr.setRequestHeader('kafeimao','I love eating');
//3.5注册回调函数
xhr.onload = function(){
console.log(xhr.responseText);
//修改页面的dom元素
document.querySelector('h3').innerHTML=xhr.responseText;
}
//4.请求主体发生(get请求为空,或者写null,post请求数据写在这里,如果没有数据直接写空或者为null
xhr.send(null);
}
</script>
getDate.php文件
<?php
//返回发送过来的数据
print_r($_GET);
?>