为jQuery的$ .data()存储多个值的最佳方法是什么?

Luk*_*nis 11 jquery storage dom

如果在大量div上存储多个(10+)值,将它们全部存储在单个对象中,还是作为单独的值更为理想?

单个对象:

$("#div_id").data("data", {foo:1, bar:2});
Run Code Online (Sandbox Code Playgroud)

单独的价值观:

$("#div_id")
  .data("foo", 1)
  .data("bar", 2);
Run Code Online (Sandbox Code Playgroud)

每种方法的权衡取舍是什么?其中一些属性将被频繁访问(例如在事件回调期间,例如拖动).

mko*_*nen 10

在1.4中你可以这样做:

$('#somediv').data({ one : 1, two : 2, three : 3 });
Run Code Online (Sandbox Code Playgroud)

这是初始化数据对象的好方法.但是,在1.4.2中,请记住使用此表单将替换此元素的任何现有数据.所以,如果你试试这个:

$('#somediv').data( 'one', 1 );

$('#somediv').data({ two : 2, three : 3 });
Run Code Online (Sandbox Code Playgroud)

你将吹走'一个'的价值.

(在个人方面,我认为这是一个遗憾,因为jQuery已经广泛使用与$ .extend合并对象.我不清楚为什么在这里没有使用它.)

更新(用户建议:@ricka,谢谢):

1.4.3及以上,它合并数据(http://api.jquery.com/data/#data-obj):

在jQuery 1.4.3中,使用.data(obj)设置元素的数据对象会扩展先前使用该元素存储的数据.jQuery本身使用.data()方法在名称'events'和'handle'下保存信息,并保留任何以下划线('_')开头的数据名供内部使用.

在jQuery 1.4.3之前(从jQuery 1.4开始),.data()方法完全替换了所有数据,而不仅仅是扩展数据对象.如果您使用的是第三方插件,则可能不建议完全替换元素的数据对象,因为插件可能也设置了数据.


Aym*_*ieh 6

如果两种方法在代码中都很容易使用,那么请存储单个对象.它避免了data()每次需要值时调用方法的额外开销.这样,您可以通过一次调用来获取映射对象data(),然后根据需要多次从该对象中检索值,而无需data()再次调用.

data()方法使用对象将元素映射到引擎盖下的键/值,因此与自己管理映射对象相比,它没有提供任何性能改进.