2010-12-22 120 views
7

我最近在各種HTML元素中使用標題標籤以JSON格式在DOM中存儲數據。什麼是在DOM中存儲數據的正確方法

這是一個壞的方法(我假設它是)?什麼是正確的方式來完成這與jQuery合作?通過「效果很好」我的意思是

$("myButton").click(function (e) { 
    var myData; 
    eval("myData=" + $(this).attr("title")); 
}); 

工作得很好,但同樣我假設有一個更好的辦法做到這一點沒有?

PS:順便說一句HTML元素的標題標記究竟是如何工作的?我似乎無法找到它實際上最終得到使用的地方?

PSS:我也可以得到一個基於jQuery和非jQuery響應? (對不起,是挑剔)

回答

9
eval("myData=" + $(this).attr("title")); 

這幾乎是一個合法的理由就打你! (j/k)

您應該使用自己的名稱空間對象來「全局」存儲數據。在這種情況下,全局意味着在您的應用程序代碼中只有全局的,而不是在瀏覽器中使用global objectwindow)。

var my_application = {}; 

$('myButton').click(function() { 
    my_application.myData = $(this).attr('title'); 
}); 

這當然是一個非常基本的策略。在你的特定情況下,你也可以使用jQuery的.data()方法將數據附加到DOM節點。

$('myButton').click(function() { 
    $.data(this, 'myData', this.title); 
}); 

參考:.data()jQuery.data()

+0

lol ....堅持... Isnt myData,因爲它被聲明在它駐留的匿名函數的本地eval之上嗎? – 2010-12-22 06:48:16

4

使用jQuery data()

的jQuery.data()方法允許我們在 的方式,是從 循環引用和安全連接的任何類型的數據,以DOM 元件因此免費從內存泄漏 。 jQuery確保在用戶離開頁面時通過jQuery方法刪除DOM元素 並刪除 數據。對於 單個元素,我們可以 設置多個不同的值,並檢索它們 後來:

jQuery.data(document.body, 'foo', 52); 
0

在jQuery的世界中,通常說是使用元數據插件最好的做法,因爲它是一個官方jQuery插件並且還支持HTML5數據屬性。欲瞭解更多信息,你可以看看這個http://docs.jquery.com/Plugins/Metadata/metadata

8

在你的榜樣,我會建議做以下這並不會使您 'EVAL' 的安全隱患:

myData = JSON.decode($(this).attr("title")); 

在一般來說,這是持有不安全數據的有效方法。您有許多其他選擇太:

相關問題