|
在jQuery的官方文檔中，提示用戶(hù)這是一個(gè)低級(jí)的方法，應(yīng)該用.data()方法來(lái)代替。$.data( element, key, value )可以對(duì)DOM元素附加任何類(lèi)型的數(shù)據(jù)，但應(yīng)避免循環(huán)引用而導(dǎo)致的內(nèi)存泄漏問(wèn)題，原文如下：
The jQuery.data() method allows us to attach data of any type to DOM elements in a way that is safe from circular references and therefore from memory leaks. We can set several distinct values for a single element and retrieve them later:
但對(duì)于該方法，存在的問(wèn)題也不僅于此。在JQUERY FORUM中 ，對(duì)該問(wèn)題作了深入的討論，robert.katic 提出了一條解決方案。$.data()方法應(yīng)用到宿主對(duì)象上,運(yùn)行會(huì)得到優(yōu)化，但在本地對(duì)像上使用該方法，結(jié)果未必盡如人意。一個(gè)元素在正常情況下可以使用.remove()方法將其刪除，并清除各自的數(shù)據(jù)。但對(duì)于本地對(duì)象而言，這是不能徹底刪除的，這些相關(guān)的數(shù)據(jù)一直持續(xù)到窗口對(duì)象關(guān)閉。同樣，這些問(wèn)題也存在于event 對(duì)象中，因?yàn)槭录幚砥?handlers)也是用該方法來(lái)存儲(chǔ)的。
那么，要解決該問(wèn)題最簡(jiǎn)單的方法是將數(shù)據(jù)存儲(chǔ)到本地對(duì)象新增的一個(gè)屬性之中。即：
// ...
if ( elem.nodeType ) {
cache[ id ] = dataObject;
elem[ expando ] = id;
} else {
elem[ expando ] = dataObject;
}
// ...
但是，一旦涉及到繼承問(wèn)題，該方法就無(wú)能為力。試看：
var parent = {};
var childA = Object.create( parent );
var childB = Object.create( parent );
$.data( parent, "foo", "parent value" );
// This may even be intentional
$.data( childA, "foo" )
// => "parent value"
$.data( childB, "foo" )
// => "parent value"
// This may NOT be intentional
$.data( childA, "foo", "childA value" );
$.data( parent, "foo" )
// => "childA value"
$.data( childB, "foo" )
// => "childA value"
開(kāi)始時(shí)，存儲(chǔ)數(shù)據(jù)的對(duì)象不存在，因此創(chuàng)建一個(gè)對(duì)象來(lái)存儲(chǔ)新的值，如圖
現(xiàn)在，我們嘗試去修改對(duì)象childA同樣的數(shù)據(jù)。
對(duì)象childA并不存在該數(shù)據(jù)，因此它沿著原型鏈向上查找，父對(duì)象剛好擁有該數(shù)據(jù)，其值立即被改寫(xiě)。所以，從parent和childB這兩個(gè)對(duì)象獲取“foo”的值，得到的將是“childA value”，而不是“parent value”。
出處：
責(zé)任編輯：bluehearts
上一頁(yè) 下一頁(yè) jQuery.data()方法與內(nèi)存泄漏 [2]
◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。
|
第 1 頁(yè) jQuery.data()方法與內(nèi)存泄漏 [1]
第 2 頁(yè) 
