为什么div里不显示内容？

来源：2-8 自由编程

三国狂热

2019-04-13 15:43:17

<%@ 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">
body {
    text-align: center;
}

div {
    width: 100%;
    height: 200px;
}
</style>
</head>
<body>
    <button id="b1">员工列表</button>
    <button id="b2">职位列表</button>
    <button id="b3">部门列表</button>
    <div id="divContent"></div>
    <script type="text/javascript" src="js/jquery-3.4.0.js"></script>
    <script type="text/javascript">
        var xmlhttp;
        if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
        } else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        
        $("#b1").click(function() {
            xmlhttp.open("GET", "/employee/EmployeeServlet", true);
            xmlhttp.send();
            console.log("请求发送完成");
            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.lenth; i++) {
                        var emp = json[i];
                        html = html + emp.name + "<br/>";
                    }
                    document.getElementById("divContent").innerHTML = html;
                }
            }
        });
        $("#b2").click(function() {
            xmlhttp.open("GET", "/employee/EmployeeServlet", true);
            xmlhttp.send();
            console.log("请求发送完成");
            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.lenth; i++) {
                        var emp = json[i];
                        html = html + emp.position + "<br/>";
                    }
                    document.getElementById("divContent").innerHTML = html;
                }
            }
        });
        $("#b3").click(function() {
            xmlhttp.open("GET", "/employee/EmployeeServlet", true);
            xmlhttp.send();
            console.log("请求发送完成");
            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.lenth; i++) {
                        var emp = json[i];
                        html = html + emp.department + "<br/>";
                    }
                    document.getElementById("divContent").innerHTML = html;
                }
            }
        });
    </script>
</body>
</html>

写回答

1回答