首页设计一个JSP页面Table.jsp，其功能为显示一个11行3列的表格

设计一个JSP页面Table.jsp，其功能为显示一个11行3列的表格

时间: 2024-10-01 16:13:05 浏览: 69

设计一个简单的JSP页面（如Table.jsp）用于显示一个11行3列的表格，可以按照HTML表格结构编写，并利用JSP的内建标签`<c:forEach>`遍历数据来动态生成每一行和列。以下是页面的基本结构： ```jsp <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>11x3表格</title> <style> table { border-collapse: collapse; width: 100%; } th, td { text-align: center; padding: 8px; border: 1px solid black; } </style> </head> <body> <table> <tr> <%-- 标题行 --%> <th>标题1</th> <th>标题2</th> <th>标题3</th> </tr> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>  <c:forEach items="${rows}" var="row" begin="0" end="10"> <tr> <%-- 动态生成每一行 --%> <c:forEach items="${row}" var="cell" begin="0" end="2"> <td>${cell}</td> </c:forEach> </tr> </c:forEach> </table>  <script type="text/javascript"> // 如果需要，还可以通过JavaScript动态填充数据 var data = [ ["数据1", "数据2", "数据3"], ... /* 重复9次 */, ["数据33", "数据34", "数据35"] ]; var table = document.getElementsByTagName("table")[0]; for (var i = 1; i <= data.length; i++) { for (var j = 0; j < data[i - 1].length; j++) { var row = table.insertRow(i); var cell = row.insertCell(j); cell.innerHTML = data[i - 1][j]; } } </script> </body> </html> ``` 在这个例子中，`rows`变量通常会被Java后端控制器（例如Servlet或Spring MVC）填充数据。然后，JSP页面会根据这些数据动态生成表格。

阅读全文