表格数据"/>
html页面拼接,表格数据
controler层：
@RequestMapping("/a2")public List<User> a2(){LinkedList<User> list = new LinkedList<>();list.add(new User("python",1,"男"));list.add(new User("java",3,"女"));list.add(new User("sql",6,"男"));return list;}
js代码：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head><title>$Title$</title><script src="${pageContext.request.contextPath}/statics/js/jquery-3.6.0.js"></script><script>$(function () {$("#btn").click(function () {//$.post(url, param[可以省略] success)$.post("${pageContext.request.contextPath}/a2", function (data) {var html = '';for (let i = 0; i < data.length; i++) {html += "<tr>" +"<td>" + data[i].name + "</td>" +"<td>" + data[i].age + "</td>" +"<td>" + data[i].sex + "</td>" +"</tr>"}$("#content").html(html)})})});</script>
</head>
<body>
<input type="button" value="加载数据" id="btn">
<table><tr><td>姓名</td><td>年龄</td><td>性别</td></tr><tbody id="content"><%-- 数据 后台--%></tbody>
</table>
</body>
</html>点击加载数据，触发事件
效果图：
更多推荐
html页面拼接,表格数据
发布评论