爲jQuery的$ .data（）存儲多個值的最佳方法是什麼？

Question

如果在多個div上存儲多個（10+）值，將它們全部存儲在單個對象中還是作爲單獨的值更爲優化？

單一對象：

$("#div_id").data("data", {foo:1, bar:2}); 

不同的值：

$("#div_id") 
    .data("foo", 1) 
    .data("bar", 2); 

什麼是每種方法的取捨？這些屬性中的一些會經常被訪問（例如在拖動等事件回調期間）。

Answer 1

如果這兩種方法在您的代碼中都很容易使用，那就去存儲一個對象。它避免了每次需要值時調用data()方法的額外開銷。這樣，您可以通過一次調用data()來獲取映射對象，然後根據需要多次從該對象中檢索值，而無需再次調用data()。

data()方法使用對象來映射元素到鍵/值下的元素，所以它不提供任何性能改進而不是自己管理映射對象。

Answer 2

我可能會做這樣的事情：

var data = $("#div_id").data(); 
data.foo=1; 
data.bar=2; 

Answer 3

在1.4，你可以這樣做：

$('#somediv').data({ one : 1, two : 2, three : 3 }); 

這是初始化數據對象的好方法。但是，在1.4.2中，請記住使用此表單將替換此元素上的任何現有數據。所以，如果你試試這個：

$('#somediv').data('one', 1); 

$('#somediv').data({ two : 2, three : 3 }); 

你會吹掉'one'的值。

（就我個人而言，我認爲這是一種恥辱，因爲jQuery的已經廣泛使用，其$ .extend合併的對象。它不是很清楚，我爲什麼沒有在這裏使用。）

UPDATE（由用戶建議：@ricka，謝謝）：

1.4.3和上，它融合了數據（http://api.jquery.com/data/#data-obj）：

在jQuery的1.4.3設置與元素的數據對象。數據（obj） 擴展了d ata先前與該元素一起存儲。 jQuery本身 使用.data（）方法保存名稱'事件' 和'句柄'下的信息，並保留任何數據名稱，以 下劃線（'_'）開頭供內部使用。

在jQuery 1.4.3之前（從jQuery 1.4開始），.data（）方法 完全替代了所有數據，而不是僅僅擴展數據 對象。如果您使用的是第三方插件，建議您不要使用 來完全替換元素的數據對象，因爲插件可能會在 中設置數據。