data和attr、prop的作用類似 都是給元素新增屬性,但是data可以防止dom元素與物件之間的互相引用,從而防止出現記憶體洩漏的現象。
為了避免記憶體洩漏 data採用間接為元素新增屬性的方法實現 data新增元素屬性並不是新增到元素上,而是新增到了乙個json資料中,通過在元素上新增乙個唯一屬性,讓該屬性與json陣列建立聯絡。data可以作為工具方法和例項方法使用
var obj = {};
$.data(obj,'name','hello');
$.removedata(obj,'name');
console.log($.data(obj))
$('#div1').data('name','hello');//設定
console.log($('#div1').data('name'));//獲取
$('#div1').removedata('name')
jquery的最新版本(3.0.0)與以往的思想不同。 在該版本中,data新增屬性時 將json直接賦值給了唯一屬性名。這種方式如何避免記憶體洩漏,還未想明白
原始碼中有乙個data類(3.0.0),工具方法和例項方法都是基於這個data類實現的,我們先看一下該類的實現
data的工具方法和例項方法基本上都是對該類的呼叫 很容易理解 這裡不再詳var acceptdata = function( owner ) ;
function data() ;
// we can accept data for non-element nodes in modern browsers,
// always return an empty object.
if ( acceptdata( owner ) ) else );}}
}return value;
},//設定cache的值
set: function( owner, data, value ) ] args
} else
}return cache;
},//獲得cache中的屬性值 若key為undefined 返回所有屬性
get: function( owner, key ) ,
//合併get方法和set方法
access: function( owner, key, value )
this.set( owner, key, value );
return value !== undefined ? value : key;
},remove: function( owner, key )
if ( key !== undefined ) else
i = key.length;
while ( i-- )
}// remove the expando if there's no more data
// 當key不存在時 清空cache
if ( key === undefined || jquery.isemptyobject( cache ) ) else
}},hasdata: function( owner )
};var rbrace = /^(?:\|\[[\w\w]*\])$/,//匹配json和陣列
rmultidash = /[a-z]/g;
//該函式完成h5中的"data—"格式的屬性值
function dataattr( elem, key, data ) catch ( e ) {}
// make sure we set the data so it isn't changed later
datauser.set( elem, key, data );
} else
}return data;
}
jQuery原始碼分析
工具 版本說明 版本號備註 jquery 2.1.1 sublime 3jquery function selector,context jquery.fn jquery.prototype 快速匹配正則 不加g 不光匹配整體項還會匹配到子項 rquickexpr s w w w init jque...
jQuery原始碼分析
一 jquery如何做到不汙染變數名並暴露出 供使用者使用 jquery將變數和 寫進立即執行函式,通過函式來包裹所有的變數和方法,再在這個立即執行函式上將 jquery方法繫結到window上,就可以讓使用者使用到jq方法了。二 jquery是如何做到 jquery 的?function wind...
jQuery 原始碼分析
這篇文章可以說是讀這篇文章這篇文章後的總結。jquery最基本的構成結構 var jquery window.jquery window.function a,b jquery.fn jquery.prototype age function jquery.fn.init.prototype jqu...