第一步:创建Servlet基础
第二步:
1.创建XmlGttpRequest对象
2.发送Ajax请求
3.处理服务器响应
<body>
<input id="btnLoad" type="button" value="加载"/>
<div id="divContent"></div>
<script>
document.getElementById("btnLoad").onclick = function (){
//1.创建XmlHttpRequest对象
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
//2.发送ajax请求
xmlhttp.open("Get","/content");
xmlhttp.send();
//3.处理服务器响应
xmlhttp.onreadystatechange=function ()//事件用于监听ajax的执行过程
{
if (
xmlhttp.readyState==4//这个属性用于说明XMLHttpRequest的当前状态,4代表响应文本已被接收
&&xmlhttp.status==200//代表服务器当前响应的状态码,200代表成功
){
//获取响应体的文本
var responseText = xmlhttp.responseText;
//对服务器结果进行处理
document.getElementById("divContent").innerHTML =
document.getElementById("divContent").innerHTML+"</br>"+responseText;
}
}
}
</script>
</body>
补充:对应的类对象-->用于提供响应体文本
@WebServlet("/content")
public class ContentServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.getWriter().println("<b style='color:red'>I'm Server Content</b>");
}
}