貯藏JSON：使用Javascript VS HTML

我是從這樣一個Ajax請求得到一個JSON對象：貯藏JSON：使用Javascript VS HTML

"items":[  
    { 
     "id":923, 
     "id_str":"608475747557236737", 
     "uid":407388514, 
     "date":"Wed Jun 10 03:28:17 +0000 2015", 
     "status":0, 
    }, 
    { 
    "id":923, 
     "id_str":"608475747557236737", 
     "uid":407388514, 
     "date":"Wed Jun 10 03:28:17 +0000 2015", 
     "status":0, 
    } 
]

我環路JSON對象，並生成HTML元素。

我的問題是如果是最好的存儲在每個HTML元素，如我們的json信息：data-prop1="",data-prop2=""等，我保持數據在一個JavaScript var類似數組？

的HTML元素的信息將通過Ajax請求到服務器再次發送，所以我要保存和恢復送。

來源

2015-06-10 mauriblint

爲什麼不把它作爲對象存儲在JavaScript中？ – ItayB

你將再次發送數據的格式是什麼？ –

從性能的角度來看它是好得多它直接存儲在一個變量，而不是在HTML元素

DOM操作都昂貴（選擇/訪問該HTML元素，其保持數據）。
這也是因爲data attributes只對HTML5的瀏覽器應用

它也更容易console.log它，在你的開發工具檢查它的大多數跨瀏覽器兼容的方式。

就個人而言，我只用當需要很少的信息（比如一對夫婦的屬性）存儲每個元素和信息將通過元素本身在直接點擊/懸停事件被髮送data-*屬性 - 否則，將它存儲在DOM中並沒有多大意義。

沒有從節約了DOM整個JSON的，如果你發現它更容易阻止你 - 但是，如果你繼續這樣做你會最終有一個非常令人費解的標記和模式，只是看起來很可怕

來源

2015-06-10 03:57:37

-1

我會建議不要在html中存儲任何地方，因爲您要將元素傳遞給另一個Ajax請求。所以只需在javascript中創建變量並將其暫時存儲即可。

來源

2015-06-10 04:10:34

我與目前類似的情景工作，我選擇來實現對持有該信息的客戶端的模型，因爲在DOM存儲一切都可能是有害的整體性能。

換句話說我有一些HTML代碼，例如

<div id='element-1' class='element'>foo</div> 
<div id='element-2' class='element'>bar</div> 
<div id='element-3' class='element'>baz</div>

其對應於收到數據

[{id:1, text:'foo'}, {id:2, text:'bar'}, {id:3, text:'baz'}]

代替使用DOM我有保持該數據的模型對象，並可以從任何地方訪問，並具有搜索數據，渲染數據等的方法。

這種對象的非常簡單的例子看起來是這樣的：

function Model() { 

    this.data = []; //after recieving the data via Ajax it is stored here 

    this.find = find; 
    function find(id) { 
     //cycle through data and return the correct record 
    } 

    this.render = render; 
    function render(id) { 
     var obj = find(id); 

     // find the element with $('#element-'+id) and update it's text 
    } 

    this.update = update; 
    function update(id, text) { 
     var obj = find(id); 
     obj.text = text; 
    }   
}

的好處是，你不要讓DOM重，你把你的數據在一個乾淨的和有組織的方式垮臺是您必須保持顯示的數據和模型數據同步。

來源

2015-06-10 06:48:25 Dropout

當然，記得在初始化項目時創建一個對象實例，例如'var myModel = new Model（）;':) – Dropout

Thanks Dropout !!看來你所做的和我的非常相似。有沒有辦法避免通過所有項目找到特定的id的循環？也許我可以在陣列中擁有大約100多個物品，效率會如何？我想可能創建一個自定義索引的數組，例如Model.data [item_id] = {json object}。 – mauriblint

對不起，我只爲數據使用了一個非常簡單的樹形結構，性能在我這邊不是問題。也許你可以使用某種類似文件夾的系統，其中ID將指示數據存儲在哪個分支中，但這只是一個想法。恐怕我無法幫助你。 – Dropout

貯藏JSON：使用Javascript VS HTML

回答

相關問題