jQuery.data（）命名空間

Question

如何避免與其他jQuery插件衝突使用$.data()？

我想我可能會使用一個密鑰存儲像

$(el).data('myplugin', { foo: 'a', xyz: 34});

我的數據和訪問它像$(el).data('myplugin').foo等

但如何能輕易改變的值，而無需重寫整個數據？就像改變「富」的價值一樣。

Answer 1

爲什麼不使用

$(el).data('myplugin.foo') 

和

$(el).data('myplugin.xyz') 

？

所以，如果你不需要同時訪問多個值，你可以避免無用的間接和測試。

Answer 2

只需更改您想要更改的屬性。

http://jsfiddle.net/rQQdf/

var el = $("<div />");  
el.data("myPlugin",{ foo: "foo" }); 
console.log(el.data("myPlugin").foo); // foo 
el.data("myPlugin").foo = "bar"; 
console.log(el.data("myPlugin").foo); // bar 

至於命名空間衝突，一種解決方案是在運行時生成（當插件被定義）的時間戳，並使用該時間戳在您的命名空間。在最快的瀏覽器中，它仍然沒有100％的保護以抵禦衝突，但它變得非常接近。

Answer 3

我個人使用以連字符分隔的命名約定，它在擁有代碼的實體的縮寫標識符前加上類名稱，ID，數據屬性等，另一個用於功能區域。

如果我在一個圖形程序的公司美孚正在努力，我的前綴可能是：

foo-chart- 

這讓我做公司獨有的所有公司標識符和代碼領域獨特彼此（以避免與其他功能區域的其他開發者發生衝突）。

人爲的例子：

<button id="foo-chart-refresh" class="foo-chart-interact" data-foo-chart-last="201205031421">Refresh Chart</button> 
<script type="text/javascript"> 
    var lastRefresh = $('#foo-chart-refresh').data('fooChartLast'); // see docs on .data() for case/hyphenation handling 
</script> 

我覺得用一個連字符，幾乎任何地方非常適合我的標識符將需要 - 無論是作爲一個標記ATTR值或名稱或代碼等你可以使用任何符合你需要的字符（.是很常見的）