前端开发, 会有这样的需求, 将一些数据绑定到一个DOM上面, 来完成自己的一些工作需求.
比如, 新浪微博的点赞的人数.
简陋一点的办法就是, 可以直接把数据设置成DOM的自定义属性. $("#domId").attr("likeCount", 1234);
但是这样有两个缺点,
1, 直接把数据暴露给用户了, 审查元素直接可以看到, 一点也不隐私, 万一有好事者怎么办?
2, 万一需要存储很复杂的对象呢? 怎么办?
jquery.data 这个方法可以很好的解决这个问题. 使用方法详见jquery api 文档. (http://api.jquery.com/data/)
1, 对于第一个问题, 数据是存在jquery.cache里面的, 不那么容易被窥探到.
2, 对于第二个问题, $("#domId").data(key, value) 这里的value可以是个js对象, 也就允许存很复杂的东西了.
同时这个方法, 也是兼容HTML5 data-* 这些属性的.
下面这段代码可以检查jquery的cache:
(function ($) { $(function() { $('.dummy').data('foo', 'bar'); $.each($.cache, function (k, v) { if (v.foo) { $('body').append($('<div>found foo: ' + v.foo + ' at index ' + k + '</div>')); } }); }); }(jQuery));