ajax构造get、post、put请求
前端代码:
<body>
<div class="one">
</div>
<button id="doGet">get</button>
<button id="doPost">post</button>
<button id="doPut">put</button>
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script>
let doGetBtn = document.querySelector(#doGet);
doGetBtn.onclick = function(){
$ajax({
type:get,
url:hello,
success:function(body) {
let div = document.querySelector(.one);
div.innerHTML = body;
}
});
}
let doPostBtn = document.querySelector(#doPost);
doGetBtn.onclick = function(){
$.ajax({
type:post,
url:hello,
success:function(body) {
// console.log(body);
let div = document.querySelector(.one);
div.innerHTML = body;
}
});
}
let doPutBtn = document.querySelector(#doPut);
doGetBtn.onclick = function(){
$.ajax({
type:put,
url:hello,
success:function(body) {
// console.log(body);
let div = document.querySelector(.one);
div.innerHTML = body;
}
});
}
</script>
</body>
</html>
后端代码:
@WebServlet("/studentInfo")
public class StudentInfoServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//假设客户端发来的请求形如 /studentInfo?classId=104&studentId=3
//就可以通过getParameter 方法来拿到这两个 id 的值
resp.setContentType("text/html;charset=utf8" );
String classId = req.getParameter("classId");
String studentId = req.getParameter("studentId");
resp.getWriter().write("classId"+classId+","+"studentId"+ studentId);
}
}
@WebServlet("/StudentInfo2")
public class StudentInfoServlet2 extends HttpServlet {
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("test/html;charset=utf8");
String studentId = req.getParameter("studentId");
String classId = req.getParameter("classId");
resp.getWriter().write("classId"+classId+","+"studentId"+ studentId);
}
}
