<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Ajax实例</title>
</head>
<body>
<script>
function loadXMLDoc(){
var xhr;
if(window.XMLHttpRequest){ //1.创建XMLHttpRequest对象(异步调用对象)
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.onreadystatechange=function(){ //3.设置http请求状态变化的函数
if(xhr.readyState==4&&xhr.status==200){
var responseText=xhr.responseText; //5.获取异步调用返回数据
document.getElementById('div').innerHTML=responseText; //6.使用JS、DOM实现局部刷新
}
}
xhr.open('GET',URL,true); //2.创建http请求
xhr.send(); //4.发送http请求
}
</script>
<div id="div"><h2>以下是Ajax实例，使用Ajax修改文本</h2></div>
<button type="button" onClick="loadXMLDoc()">修改内容</button>
</body>
</html>注：以上代码中的URL指你要调用的后端接口。
扫一扫
1912
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
