jsp页面解析后台传来的链表并呈现在表格中

之前做了一次总结，解析链表，把解析和展现在页面的过程分开了，首先生成Js代码，然后再生存Html代码，代码如下：

<%@ page import="java.util.List" %>
<%@ page import="com.web.entity.Film" %>
<script>
function createTable_play()
        {
        var table = document.createElement("table");
        var title = ['影片编号','影片名','状态','类型','语种','详细','修改','删除'];
        var tr1 = document.createElement("tr");
        for (var j = 0; j < title.length; j++)
        {
            var td = document.createElement("td");
            td.innerHTML = title[j];
            tr1.appendChild(td);
        }
        table.appendChild(tr1);

        <% List film = (List)request.getAttribute("film");
               for(int i=0; i<film.size(); i++)
               {
                   Film f = (Film) film .get(i);
           %>
        var tr = document.createElement("tr");
        var fid = "<%=f.getId()%>";
        var fname = "<%=f.getName()%>";
        var fstatus = "<%=f.getFile_status()%>";
        var ftype = "<%=f.getFilm_type()%>";
        var flang = "<%=f.getLang()%>";
        var data = [fid,fname,fstatus,ftype,flang,"详细","修改","删除"];

        for (var j = 0; j < data.length; j++)
            {
                var td = document.createElement("td");
                 if (j == 5 || j == 6 || j == 7)
                 {
                        var a = document.createElement("a");
                        a.innerHTML = data[j];
                        a.style.cursor = "pointer";
                        td.appendChild(a);
                        if (j == 5)
                        {
                            a.onclick = function()
                            {
                                find_play(this);
                            }
                        }
                        else if (j == 6)
                        {
                            a.onclick = function()
                            {
                                update_play(this);
                            }
                        }
                        else
                        {
                            a.onclick = function()
                            {
                                del_play(this);
                            }
                        }
                 }
                 else
                 {
                      td.innerHTML = data[j];
                 }
                tr.appendChild(td);
                }
            table.appendChild(tr);
        <%
        }
        %>
                    document.getElementById("play").appendChild(table);
}

</script>

其实两个可以同时进行的，一边解析一边将数据加入标签，省去了浏览器解析js代码的过程，提高了页面加载的效率。代码如下：

<%@ page import="java.util.List" %>
<%@ page import="com.web.entity.Film" %>

<div id="play">
<table>
   <tr style="font-weight: 900; font-size: 18px">
         <td>影片编号</td>
         <td>影片编号</td>
         <td>状态</td>
         <td>类型</td>
         <td>语种</td>
         <td>详细</td>
         <td>修改</td>
         <td>删除</td>
   </tr>
   <% List film = (List)request.getAttribute("film");
       for(int i=0; i<film.size(); i++)
       {
           Film f = (Film) film .get(i);
   %>

      <tr>
          <td><%=f.getId()%></td>
          <td><%=f.getName()%></td>
          <td><%=f.getFile_status()%></td>
          <td><%=f.getFilm_type()%></td>
          <td><%=f.getLang()%></td>
          <td><a onclick="find_play(<%=f.getId()%>)">
          详细</a></td>
          <td><a onclick="update_play(<%=f.getId()%>)">修改</a></td>
          <td><a onclick="del_play(<%=f.getId()%>)">删除</a></td>
     </tr>
    <%
     }
    %>
 </table>
 </div>