[jQuery API] $.data()

很多時候我們會將物件的屬性值繫結在元素的屬性上面(我從以前就習慣這樣lol)。
然後再透過$('selector').attr('key') 拿取，

不過這個方法會造成dom過長( 也會降低seo的內容代碼比。 )，

不過常常遇到需求變更時又要多一個屬性，感覺很不方便。

建議使用jQuery提供的$.data()方法來儲存你的資料。
jQuery.data( element, key, value )

• element - 必要的參數，這個屬性就是我們要塞入資料的節點。
• key - 欲塞入資料的鍵值，往後取得資料使用。
• value - 欲塞入的資料，可為任何的資料型態。

jQuery.data(div, "test", { first: 16, last: "pizza!" });
$("span:first").text(jQuery.data(div, "test").first);
$("span:last").text(jQuery.data(div, "test").last);

如果你已經確定要綁定在某個元素上的話請用$.data()效能會比較好。
另外這方$.data()，也可以用在非元素上的資料存儲

var usersList = {};//store user list with key/value
$.data(usersList,user.userName,user);//user is json object

要取得資料的話也蠻方便的

var userData = $.data(usersList,userName);//userName is key
var userRowindex = userData.rowIndex;//某一個屬性值

Reference:
$.fn.data 與 $.data效率比較 
jQuery.data()
利用 jQuery 的 data 方法取數值時的陷阱