0

这是我需要表达的 IA。（树模型）

about us
    company
        history
        location
    ceo
product
    mobile
        iphone
        galaxy 3

这是我需要制作的 HTML DOM。如您所见，depth2并且depth3（最多 5 或 6 个）位于同一级别的 DOM 中，并且 depth1 将它们作为子级。（由于 CSS，我必须这样做）

<div class="depth1"><span>about us</span>

    <div class="depth2">company</div>   
    <div class="depth2">ceo</div><!--CEO is here! not below "location" -->

    <div class="depth3">history</div>   
    <div class="depth3">location</div>

</div>


<div class="depth1"><span>product</span>

    <div class="depth2">mobile</div>

    <div class="depth3">iphone</div>    
    <div class="depth3">galaxy 3</div>

</div>

并且数据是mysql这样插入的。（p_id表示父母的身份证）

id(pk)  p_id    level   order   name
------------------------------------------
1       root        0       0       -
2       1       1       100     about us
3       7       2       100     mobile
4       5       3       200     location
5       2       2       100     company
6       5       3       100     history
7       1       1       200     product
8       3       3       100     iphone
9       3       3       200     galaxy
10      2       2       200     ceo

我试过order by level, order但结果不正确。（顺序应与 HTML DOM 顺序相同）

id(pk)  p_id    level   order   name
------------------------------------------
1       root        0       0       -
2       1       1       100     about us
7       1       1       200     product
3       7       2       100     mobile
5       2       2       100     company
10      2       2       200     ceo
8       3       3       100     iphone
6       5       3       100     history
4       5       3       200     location
9       3       3       200     galaxy

我如何订购与 HTML 订单相同的订单？

最难的部分是depth2或depth3在其父级（深度1）下方（作为一个组）。

id(pk)  p_id    level   order   name
------------------------------------------
1       root        0       0       -
2       1       1       100     about us
5       2       2       100     company
10      2       2       200     ceo
6       5       3       100     history
4       5       3       200     location
7       1       1       200     product
3       7       2       100     mobile
8       3       3       100     iphone
9       3       3       200     galaxy 3

我做了一个jQuery代码来解决我的问题。但我不能申请jQuery，因为实际数据太大（数百），重新排列 HTML 元素需要一些烦人的时间。我不能负担客户端。

我搜索了如何提高 jQuery 性能。但我必须考虑禁用用户的 javascript。

请分享您的不同观点或新鲜想法甚至技巧。（表达语言是JSP）谢谢。

4

1 回答 1

0

如您所见，可以通过一个简单的查询从数据库中提取数据，然后编写代码以使用该数据填充树结构。

我不确定你为什么认为唯一的选择是在流程的最末端——数据库和表示层。

你没有说你在中间层使用的是什么编程语言——我猜它不是带有 jQ​​uery 的 JavaScript。不管是什么，执行数据库查询的中间层服务器端语言肯定比客户端 JavaScript 更适合创建树结构。

如果您出于某种原因确实必须在数据库中执行此操作，我建议您使用存储过程。

另请注意，其他一些数据库为此目的具有分层查询语法（如 Oracle 的“CONNECT BY”）。

于 2013-01-10T02:40:28.903 回答