針對ajax/javascript/jquery數據結構的建議頁面

這是一個JavaScript/Ajax網頁（也使用jQuery）。針對ajax/javascript/jquery數據結構的建議頁面

我有我需要顯示的嵌套結構。在顯示頂級元素後，用戶可以點擊它並查看它下面的級別（動態生成）。

我不想預先生成所有內容並用display將其隱藏：none（頁面很複雜，我簡化了這個問題） - 我想從javascript數組中獲取顯示，阿賈克斯。

我的問題：

我有兩個選擇：

1：創建一個平面數組：一個元素我從陣列的ID的onclick

[ {id: xx, children: [ xx, xx, .. ] }, ....]

然後，找到孩子們，從陣列中拉出來並顯示出來。（我想我會具有通過陣列進行搜索，因爲有在JavaScript沒有關聯數組 - 或使一個索引。）

2：創建嵌套數組：

{ id: xx, children [ { id: xx, children : [....] }, {....} ] }

然後以某種方式結合當我顯示數組中的子元素時，

我有兩個問題，第二種方法：

答：我經常複製陣列的大塊爲每一個孩子，當我創建它。（至少我認爲我是，我需要使用深層複製嗎？我可以參考嗎？）

B：我不知道如何將數據綁定到子元素。通常我使用帶有onClicks的html字符串構建顯示，然後附加整個事物。但onClicks只能使用ID而不是數組的副本。

來源

2011-03-22 Ariel

是否有可能在DOM中的隱藏元素內部構建（預顯示）此結構，而不是像這樣存儲一個複雜的數據片段？ – 2011-03-22 13:25:42

佈局因點擊順序而異，所以很難預先渲染它。 – Ariel 2011-03-22 20:32:08

如果有人看到這個問題：不要使用選項2.我做了（起初），這是一場噩夢。你必須通過每一個可能調用另一個函數的函數一直帶有狀態。使用單個標識符製作一個簡單的列表，並在您的函數中傳遞該標識符。確保你可以找到一個孩子的父母（雙重鏈接）。我最終不得不花費大量的時間來重構所有的東西，因爲代碼變得難以管理。 – Ariel 2011-06-14 05:24:22

我做了類似的事情最近在那裏我有一個非常大的嵌套結構（超過2000個節點） - 我不想批量追加到DOM。

我最終什麼事做正在採取AJAX加載數據，並將其轉換成一個嵌套結構...

<node id="1" title="a"> 
    <node id="2" title="b /> 
    <node id="3" title="b"> 
     <node id="4" title="d" /> 
    </node> 
</node> etc...

...和存儲這是一個jQuery對象（節點），但絕不會將其附加到DOM。

然後我可以選擇一個節點的直接孩子，我需要他們相對容易，對於轉換成HTML元素和追加到DOM，添加數據，等等

$("#"+ID+">node", nodes).each(function() { 
    var node = $(this); 
    //do whatever... 
});

我不知道這是否是最具有內存效率的方法，但它確實使您可以非常輕鬆地根據需要選擇節點的直接子節點並將其附加到DOM。

來源

2011-03-27 22:06:03 Trev

我傾向於使用第二種方法，因爲它具有更好的結構，並且隨着遞歸的進行，您可以編寫更少的代碼。

你說你不知道如何子元素的數組綁定，而不實際創建的DOM元素，以及如果使用<!DOCTYPE html>對HTML你的元素可以有html-*屬性讓您的數據存儲在一個元素，例如：

<ul id="lists"> 
    <li class="parent" id="root_22" data-children="{some object}">A Root Elelment</li> 
</ul>

這種方法的問題是，你將不得不將每個孩子的子元素存儲在根元素中，這很可能是開銷。

另一種方法是使用jQuery.data方法綁定數據，這將保持DOM乾淨，但會將數據附加到元素。

存儲與指定元素關聯的任意數據。

@see：http://api.jquery.com/jQuery.data/

來源

2011-03-22 13:35:33 RobertPitt

針對ajax/javascript/jquery數據結構的建議頁面

回答

相關問題