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); } }