请老师看一下代码并回答几个问题
来源：2-8 自由编程
96年的nash
2019-04-16 15:47:48
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
*{
padding:0px;
margin:0px;
}
#buttonText{
width:100%;
text-align: center;
margin: 30px;
margin-bottom: 0px;
}
input{
padding-left: 20px;
padding-right: 20px;
width: 25%;
margin-left: 10px;
margin-right:10px;
}
#content{
height: 100px;
text-align: center;
}
</style>
</head>
<body>
<div id="buttonText">
<input type="button" value="员工列表" id="emplyeeList">
<input type="button" value="职位列表" id="workList">
<input type="button" value="部门列表" id="departmentList">
</div>
<div id="content">
</div>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript">
var xmlhttp, id;
if( window.XMLHttpRequest ){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft XMLHTTP");
}
$("#emplyeeList,#workList,#departmentList").click(function(){
var url = "/ajax/practice?id=" + this.id;
xmlhttp.open("GET", url, true);
xmlhttp.send();
xmlhttp.onreadystatechange = function(){
if( xmlhttp.readyState==4 && xmlhttp.status==200 ){
var text = xmlhttp.responseText;
console.log(text);
var json = JSON.parse(text);
console.log(json);
var html = "";
for( var i=0; i<json.length; i++ ){
html = html + "<div>" + json[i] + "</div>";
}
document.getElementById("content").innerHTML = html;
}
}
});
</script>
</body>
</html>package com.hxh.ajax;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.alibaba.fastjson.JSON;
/**
* Servlet implementation class Practice
*/
@WebServlet("/practice")
public class Practise extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public Practise() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
List list1 = new ArrayList<>();
list1.add("小红");
list1.add("小明");
list1.add("小白");
List list2 = new ArrayList<>();
list2.add("职员");
list2.add("经理");
List list3 = new ArrayList<>();
list3.add("人事部");
list3.add("技术部");
list3.add("无线事业部");
String json1 = JSON.toJSONString(list1);
String json2 = JSON.toJSONString(list2);
String json3 = JSON.toJSONString(list3);
response.setContentType("text/html;charset=UTF-8");
if(request.getParameter("id").equals("emplyeeList") ) {
System.out.println(json1);
response.getWriter().println(json1);
}else if(request.getParameter("id").equals("workList") ) {
System.out.println(json2);
response.getWriter().println(json2);
}else if(request.getParameter("id").equals("departmentList")) {
System.out.println(json3);
response.getWriter().println(json3);
}
}
}1、JSP和Servlet的执行顺序怎么理解？
2、是不是可以这么理解
var xmlhttp, id;
if( window.XMLHttpRequest ){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft XMLHTTP");
}
$("#emplyeeList,#workList,#departmentList").click(function(){
var url = "/ajax/practice?id=" + this.id;
xmlhttp.open("GET", url, true);
xmlhttp.send();这里浏览器发送了 Ajax请求，请求创建一个HttpRequest对象，然后在open方法中，首先指明了Get方式，其次指定了服务器中的URL地址，最后指定异步。这样服务器中那个选中的URL地址，也就是Servlet就会响应，且将需要返回的数据，返回给浏览器（就是response.getWriter().println()）
3、为什么JSP中要用两个script标签？
写回答
1回答
-
同学你好。下面来一条条回答你的疑惑：
1、我们应该是先访问的JSP页面，然后在触发单击事件后，执行到xmlhttp.send()方法时，发送了HTTP请求，转移到Servlet的对应方法，这里设置了GET，就是doGet方法中执行。当执行完代码逻辑的最后一句的时候，也就是response.getWriter().println();后response返回，这时触发xmlhttp.onreadystatechange = function()，执行其中的代码。
2、就像前面说的，同学的理解是对的。
3、第一个script标签的作用是引入jQuery库，作用相当于将jquery-3.3.1.js的js语句填入<script>标签中。
如果解答了同学的疑问，望采纳~
祝学习愉快~
0
相似问题