通用js树形导航【下】

   在上文中 通用js树形导航【上】 我们已经实现了一个动态的 js 导航树，节点信息从数据库中读取，添加修改或者删除节点内容，我们的展示层和业务逻辑层的代码一句与不用更改。
    现在有一个问题我们在 jsp  页面通过循环显示出了集合中的值，并将其作为参数传递给 add 方法。能不能我在页面做的再简单点呢？接着封装，我们将实现的步骤封装到 业务类中，业务类返回一个 String 之后我们只需要在页面中显示这个 String 就 Ok 了！

首先我们要修改业务类的方法，需要返回一个 String 类型的字符串
DBManager.java  数据库访问类 并取得 DTree 表中的所有数据 封装在一个 StringBuffer 中

package com.ant.dao;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;
import com.accp.po.DTree;
public class DBManager {
    private static final String DRIVER = "com.microsoft.sqlserver.jdbc.SQLServerDriver";
    private static final String URL = "jdbc:sqlserver://localhost:1433;databaseName=tree";
    private static final String SA = "sa";
    private static final String PWD = "sqlpwd";
    private static Connection conn=null;
    // 打开连接
    public static void getConnection() {
        try {
            Class.forName(DRIVER);
            conn = DriverManager.getConnection(URL, SA, PWD);
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        } catch (SQLException e) {
            e.printStackTrace();
        }
    }
    // 关闭连接
    public void closeConnection() {
        if (conn != null) {
            try {
                if (!conn.isClosed()) {
                    conn.close();
                    conn = null;
                }
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
    }
    // 执行在查询
    public static ResultSet executeQuery(String sql) {
        getConnection();
        Statement st;
        try {
            st = conn.createStatement();
            return st.executeQuery(sql);
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return null;
    }
    // 得到所有的节点
    public static String getAll() {
        ResultSet rs = executeQuery("select * from dtree");
        List<DTree> li = new ArrayList<DTree>();
        DTree d = new DTree();
        try {
            //这里可以直接封装到 StringBuffer 中
            while (rs.next()) {
                d = new DTree();
                d.setId(rs.getInt("id"));
                d.setPid(rs.getInt("pid"));
                d.setName(rs.getString("name"));
                d.setUrl(rs.getString("url"));
                d.setTitle(rs.getString("title"));
                d.setTarget(rs.getString("target"));
                d.setIcon(rs.getString("icon"));
                d.setIconOpen(rs.getString("iconOpen"));
                d.setOpen(rs.getString("open"));
                li.add(d);
            }
            StringBuffer contents = new StringBuffer();
            contents.append("d = new dTree('d');");
            for (DTree tn : li) {
                contents.append("\n");
                contents.append("d.add('");
                contents.append(tn.getId());
                contents.append("','");
                contents.append(tn.getPid());
                contents.append("','");
                contents.append(tn.getName());
                contents.append("','");
                contents.append(tn.getUrl());
                contents.append("','");
                contents.append(tn.getTitle());
                contents.append("','");
                contents.append(tn.getTarget());
                contents.append("','");
                contents.append(tn.getIcon());
                contents.append("','");
                contents.append(tn.getIconOpen());
                contents.append("','");
                contents.append(tn.getOpen());
                contents.append("');");
                contents.append("\n");                
            }
            contents.append("document.write(d);");        
            return contents.toString();
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return null;
    }
}

index.jsp  数据显示页面，现在的页面就简洁多了！

<%@ page language="java" import="java.util.*" pageEncoding="gbk"%>
<%@page import="com.ant.dao.DBManager"%>
<script type="text/javascript" src="script/dtree.js"></script>
<link rel="StyleSheet" href="script/dtree.css" type="text/css" />
<script type="text/javascript">
     <%=DBManager.getAll() %>
</script>

至此 我们就完成了一个通用的导航树  以后只操作数据库就好了！