jQuerys $ .data（）與DOM對象屬性

我最近需要附加一些數據來動態創建LI elements。在我的第一個例子，我在某種程度上使用.data()像

var _newli = $('<li>foobar</li>'); 
_newli.data('base', 'ball'); 
// append _newli to an `ul`

的..是非常緩慢。這個邏輯發生在一個可以容易長達500多個物品的循環中，它需要很長時間！有時甚至會打破JavaScript執行時間框架。

所以我改爲$.data()。不知何故，將數據附加到對象上比使用.data()方法調用時更快。所以，現在它看起來像

var _newli = $('<li>foobar</li>'); 
$.data(_newli[0], 'base', 'ball'); 
// append _newli to an `ul`

這是/的確是更快，但它仍然像花3-4秒（！）來建立我的所有元素（在我真正的代碼也有像6調用$。每個元素的數據）。

所以我真的被困住了，我問自己爲什麼要用.data()或$.data()呢？我可以將我的數據附加到DOM object。所以，我沒有

var _newli = $('<li>foobar</li>'); 
_newli[0].base = 'ball'; 
// append _newli to an `ul`

瞧，哇讓我震驚，那是快得令人難以置信！我無法相信這樣做沒有任何不利之處。所以這就是我的問題實際上是什麼。目前爲止，我沒有發現這種技術的缺點。有讀取約循環引用你可以使用這種方式創建，但AFAIK「只」在IE的和只有當你參考objects。

任何想法的專家？

更新

感謝您的好評和發佈人。簡短更新@patrick dw：

你是對的，我在使用$.data()時通過了下墊DOM element。它甚至沒有使用jQuery對象，至少不像預期的那樣。關於使用一個對象並將其傳遞的想法我有我自己，但後來我又對性能差異感到震驚，於是我決定忽略像永遠那樣的.data()方法。

來源

2010-08-04 jAndy

如果有*「6個調用每個元素的$ .data」*，是否有一個原因，你不只是做一個調用，並傳入一個對象的值包含所有屬性想？ '$ .data（_newli，'myvalues'，{'base'：'ball'，'basket'：'ball'，'foot'：'ball'}）;' – user113716 2010-08-04 16:47:27

約翰在一次談話中說，它很慢，並建議做'var data = $（'selector'）。data（）; data ['foo'] ='bar'; data ['bar'] ='foo';等等，這樣你只有**一個**訪問權限。只是供參考。 – 2010-08-04 16:49:33

@jAndy - 您應該將DOM元素傳遞給'$ .data（）'。不是'jQuery'對象。我想知道這是否也有性能影響。 '.data（_newli [0]，'base'，'ball'）;' – user113716 2010-08-04 17:08:28

對於循環引用是正確的，這不是IE以外的問題，在IE中它只會成爲一個問題，當JavaScript有一個DOM對象的引用，並且JS對象被分配給一個DOM對象的屬性。我相信這可以通過簡單地將JS中的所有引用無效化爲DOM對象來解決。

的$().data()方法是$.data()一個過於複雜的包裝（見jQuery.fn.data：http://github.com/jquery/jquery/blob/master/src/data.js#L126，進而調用jQuery.data：http://github.com/jquery/jquery/blob/master/src/data.js#L20），使切割出的是中間人將節省的時間不平凡量，尤其是如果它做500次。

在這種情況下，$().data('foo', 'bar')方法不會比el.foo = 'bar'做得多。做最快的事。

來源

2010-08-04 16:50:34

這些可能幫助：

和閱讀使用自定義的DTD如下：

http://htmlhelp.com/tools/validator/customdtd.html

總之，大多數情況下，我不認爲你會遇到任何使用自定義屬性的問題。大多數明智的/當前的瀏覽器都可以使用它。我會說，我確實遇到了我爲MobileSafari開發的Web應用程序的問題，這迫使我訴諸於使用~~$.data~~隱藏的元素。幸運的是，我沒有500多個元素，但更像是五六個元素。

來源

2010-08-04 16:50:29 karim79

我想我們正在談論兩個不同的故事。如果您將一些數據附加到'element.somedata = {foo：5};'沒有爲此創建'屬性'。這就像混合了'ECMAland'和'DOMland'，因爲'DOM元素'被視爲ECMAscript中的一個對象。 – jAndy 2010-08-04 17:55:59

當試圖將自定義屬性添加到NodeList對象時，瀏覽器（IE）可能會禁止它。請參閱：http://lists.w3.org/Archives/Public/public-webapps/2010JanMar/0864.html

來源

2011-01-25 15:44:13 Tim

jQuerys $ .data（）與DOM對象屬性

回答

相關問題