[Json] uso básico de json, la solicitud asincrónica de jquery devuelve datos json

JSON

Introducción a JSON

1. AJAX utilizó por primera vez el formato de datos de XML. El formato de datos de XML es muy simple y claro, y fácil de escribir. Sin embargo, debido a que XML contiene demasiadas etiquetas y una estructura muy compleja, es relativamente complicado de analizar, por lo que en la actualidad, Casi no se utiliza XML para enviar datos en AJAX. Reemplazado por una nueva tecnología JSON.

2. JSON es la abreviatura de JavaScript Object Notation y es un formato de intercambio de datos proporcionado por JS.

3. El objeto JS ON es esencialmente un objeto JS, pero este objeto es especial. Se puede convertir directamente en una cadena, pasar en diferentes idiomas y convertir a objetos en otros idiomas a través de herramientas.

4. El más utilizado en el trabajo diario es solicitud asincrónica + json.

5. Por ejemplo, hay un objeto JSON de la siguiente manera:

   1. {"Nombre": "sunwukong", "edad": 18, "dirección": "beijing"}

   2. Hay tres atributos nombre, edad y dirección en este objeto

   3. Si el objeto está entre comillas simples, se convierte en una cadena

   4. '{"Nombre": "sunwukong", "edad": 18, "dirección": "beijing"}'

   5. Una ventaja de convertirse en una cadena es que se puede pasar entre diferentes idiomas.

   6. Por ejemplo, si envía JSON como una cadena a un servlet, puede convertir la cadena JSON en un objeto Java en Java.

JSON está representado por 6 tipos de datos

1. Cuerda

• Ejemplo: "cadena"

• Nota: no se pueden utilizar comillas simples

2. digital:

• Ejemplo: 123,4

3. Valor booleano:

• Ejemplos: verdadero, falso

4. valor nulo:

• Ejemplo: nulo

5. Objeto

• Ejemplo de niño: {"nombre": "sunwukong", "edad": 18}

6. Formación

• Ejemplo: [1, "str", true]

Manipular JSON en JS

1. Crear objeto JSON

• var json = {"nombre1": "valor1", "nombre2": "valor2", "nombre3": [1, "str", verdadero]};

• var json = [{“nombre1”: ”valor1”}, {“nombre2”: ”valor2”}];

2. Convierta el objeto JSON en una cadena JSON

• JSON.stringify (JSON 对象)

3. Convierta la cadena JS ON en un objeto JSON

• JSON.parse (cadena JSON)

Manipular JSON en Java

1. En Java, puede leer una cadena JSON de un archivo, o puede ser una cadena JSON enviada por el cliente, por lo que la primera pregunta es cómo convertir una cadena JSON en un objeto Java.

2. Primero, para analizar la cadena JSON, necesitamos importar herramientas de terceros. En la actualidad, existen aproximadamente tres herramientas principales para analizar JSON: json-lib, jackson y gson. En comparación con el uso de json-lib, las tres herramientas de análisis son más complicadas y menos eficientes. Jackson y gson tienen una mayor eficiencia analítica. Simple de usar, aquí tomamos gson como ejemplo para explicar.

3. Gson es una herramienta de análisis JSON producida por Google, que es fácil de usar y tiene un buen rendimiento de análisis.

4. El núcleo del análisis de JSON en Gson es la clase Gson, y las operaciones de análisis se realizan a través de instancias de esta clase.

5. Convertir una cadena JSON en un objeto

@Test
    public void JsonToJava(){
    
    
        Gson gson = new Gson();
        String jsonStr = "{\"id\":1001,\"name\":\"张三\",\"age\":22,\"dept_id\":1}";
        /*存在map中，键值对*/
        Map map = gson.fromJson(jsonStr, Map.class);
        System.out.println(map);
        /*存到Employee对象中*/
        Employee employee = gson.fromJson(jsonStr, Employee.class);
        System.out.println(employee);


    }

6. Convertir objeto a cadena JSON

@Test
    public void JavaToJson(){
    
    
        /*转换单个对象*/
        Employee employee = new Employee();
        employee.setId(1001);
        employee.setName("张三");
        employee.setAge(22);
        employee.setDept_id(1);
        Department department = new Department();
        department.setId(1);
        department.setDep_name("研发部");
        department.setDep_location("上海");
        employee.setDepartment(department);
        Gson gson = new Gson();
        String jsonStr = gson.toJson(employee);
        System.out.println(jsonStr);

        System.out.println("====================================================");
        /*转换对象数组*/
        EmployeeDaoImpl employeeDao = new EmployeeDaoImpl();
        List<Employee> emps = employeeDao.getEmployee();
        String strs = gson.toJson(emps);
        System.out.println(strs);
    }

La solicitud asincrónica de JQuery devuelve datos JSON

bloque de código java:

@WebServlet(name = "GetEmpsJsonStrServlet",urlPatterns = "/getJsonServlet")
public class GetEmpsJsonStrServlet extends HttpServlet {
    
    
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    
    
        doGet(request,response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    
    
        Gson gson = new Gson();
        EmployeeDaoImpl employeeDao = new EmployeeDaoImpl();
        List<Employee> emps = employeeDao.getEmployee();
        /*转换成json*/
        String jsonStr = gson.toJson(emps);
        response.setContentType("text/html;charset=utf-8");
        /*写出到页面*/
        response.getWriter().println(jsonStr);
    }
}

página html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>一键显示信息</title>
    <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
    <script>
        $(function (){
     
     
            $("#showTable").click(function (){
     
     
                $.ajax({
     
     
                    url:"getJsonServlet",
                    type:"post",
                    dataType:"json",
                    success:function (data){
     
     
                        var str = "<tr><th>编号</th><th>姓名</th><th>年龄</th>" +
                            "<th>部门编号</th><th>部门名称</th><th>部门地址</th></tr>";
                        for(var i = 0; i < data.length; ++i){
     
     
                            var emp = data[i];
                            str += "<tr align='center'><td>"+emp.id+
                                "</td><td>"+emp.name+"</td><td>"+emp.age+"</td><td>"+emp.dept_id+
                                "</td><td>"+emp.department.dep_name+"</td><td>"+emp.department.dep_location +
                                "</td></tr>";

                        }
                        $("#empsTable").html(str);
                    }
                })
            })
        })
    </script>
</head>
<body>
    <h1 align="center">员工信息表</h1>
    <h1 align="center"><input id="showTable" type="button" value="点击获取员工信息" align="center"></h1>
    <table id="empsTable" align="center" width="70%" border="1px" cellspacing="0px">
        <tr>
            <th>编号</th>
            <th>姓名</th>
            <th>年龄</th>
            <th>部门编号</th>
            <th>部门名称</th>
            <th>部门地址</th>
        </tr>
    </table>
</body>
</html>

Después de hacer clic en el botón: