jQuery通过data(name,value)方法代理Dom对象实现数据缓存

很多时候我们需要在HTML标记上存储参数信息时，大部分采用在标记属性"alt"上赋值，例如：

//jQuery赋值语句
$('selector').attr('alt', 'data being stored'); 

//之后可以这样读取数据: 
$('selector').attr('alt');

使用”alt”属性来作为参数名存储数据其实对于HTML来说是不符合语义的，而且在使用长字串或存储一个JS方法时，会变得很困难。这时，我们可以使用jQuery的data方法来为页面中的某个元素存储数据,使用data方法可以避免在DOM中存储数据。

 

data(name, value)
返回元素上储存的相应名字的数据，value也可以是一个js函数。

 

这个data方法能让你自己命名数据的参数，更语义更灵活，你可以在页面上的任何元素存储数据信息
$("div").data("test", { first: 16, last: "pizza!" }); 
$("div").data("test").first //16; 
$("div").data("test").last //pizza!;
//移除存储数据
function removeData(name);

 

下面实现一个为DOM元素存储JS函数：
//函数定义
function mydata(funvar){return funvar||"data";}
$("#browser").data("mydatastr",mydata);
//之后的函数调用
alert($("#browser").data("mydatastr")("参数"));