在jQuery中增加/减少.data（）

Question

Dom元素似乎是附加与该元素相关的数据的理想场所，但访问它时代码繁琐，而且可能效率低下。

目前，我做这样的事情来增加：

$('#the-thing').data({ counter: $('#the-thing').data('counter') + 1 }) 

有递增存储在一个jQuery对象的.data（）一些更快的方法？

Answer 1

更好：

var data = $('#the-thing').data(); 
data.counter += 1; 
// `$('#the-thing').data().counter += 1` should work too 

这避免调用数据的方法两次。 documentation也说：

使用该对象直接获取或设置值比单独调用.data（）来获取或设置每个值更快。

---

您可以创建一个功能，如果你真的想：

function add(sel, prop, val) { 
    var data = $(sel).data(); 
    data[prop] += val; 
} 

由于@Zirak所指出的，如果你把这个规律电话，一个插件可能是最好的选择：

(function($) { 
    $.fn.inc = function(prop, val) { 
     return this.each(function() { 
      var data = $(this).data(); 
      if(!(prop in data)) { 
       data[prop] = 0; 
      } 
      data[prop] += val; 
     }); 
    } 
}(jQuery)) 

可用于：

$('#the-thing').inc('counter', 1); 
$('#the-thing').inc('counter', -1); 

我知道inc是不是一个好方法名称，因为它意味着你只能增加值。但我想不到更好的东西....我愿意提出建议:)