data-属性的作用

data-用于存储页面或应用程序的私有自定义数据，赋予我们在所有HTML元素上嵌入自定义data属性的能力，存储的数据能被页面的JS利用，以创建更好的用户体验。

 <div id="box" data-user-name="lily"></div>
 var box = document.getElementById("box");
 //js获取data属性数据
 var username = box.dataset.userName;
 //jQuery获取data属性数据
 var username = $("#box").data("userName");