在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是不是一個好方法名稱，因爲它意味着你只能增加值。但我想不到更好的東西....我願意提出建議:)