如何书写原生ajax完成数据交互( 二 ) _电脑

1、具体前端页面代码如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
var xmlHttp = null;
if (XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
else {
xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
}
//参数1：请求体例参数2:请求地址参数3：是否异步 true暗示异步， false暗示同步
xmlHttp.open('GET', '/bean?id=2&name=张三&sex=男', true);
xmlHttp.s(null);
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
alert(xmlHttp.responseText);
}
};
</script>
</body>
</html>
2、测试输入浏览器页面地址
http://localhost:8080/toAjax

3第三步：前端页面js原生挪用post体例的实现。
1、前端页面如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
var xmlHttp = null;
if (XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
else {
xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
}
//参数1：请求体例参数2:请求地址参数3：是否异步 true暗示异步， false暗示同步
xmlHttp.open('POST', '/bean', true);
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
xmlHttp.s('id=2&name=张三&sex=男');
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
alert(xmlHttp.responseText);
}
};
</script>
</body>
</html>
2、测试
【如何书写原生ajax完成数据交互】2.1 在浏览器中输入地址 http://localhost:8080/toAjax跳转到ajax请求页面

注重事项开辟情况jdk1.8 IDEA2018.2.2 maven apache-maven-3.5.4
建立springboot项目需要毗连互联网

以上内容就是如何书写原生ajax完成数据交互的内容啦，希望对你有所帮助哦！

如何书写原生ajax完成数据交互( 二 )

猜你喜欢