我們經常遇到在元素標籤上使用屬性data-*， 如下面代碼中的標籤：
上述代碼中定義了兩個data-*屬性， 這兩個屬性並不是特有的， 而是HTML 5中的一種新特性， 它幾乎支持目前所有的流覽器。 如果將DOM理解為一個簡單的XML， 那麼data-*就是XML節點中的自訂屬性。
data-*屬性用於存儲頁面或應用程式的私有自訂資料。
data-*屬性賦予我們在所有HTML元素上嵌入自訂data屬性的能力。 存儲的（自訂）資料能夠被頁面的JavaScript利用， 以創建更好的用戶體驗（不進行Ajax調用或伺服器端資料庫查詢）。
data-*屬性包括兩部分：1、屬性名不應該包含任何大寫字母， 並且在首碼"data-"之後必須有至少一個字元；2、屬性值可以是任意字串。
上述代碼是一個回應式的導航條， 我們沒有使用任何js代碼就可以讓導航條功能表顯示和隱藏， 這個就是data-*的作用。 如果要禁用data-*屬性的點擊功能， 則可以使用下面的代碼：
$(document).off(".data-api");
上面的代碼是禁用所有的data-*屬性， 如果頁面中有多個元素使用到了data-*屬性， 而我們只想禁用button上的事件， 則可以使用下面的代碼：
$(document).off('.button.data-api');