自定义属性

HTML5自定义属性前缀"data-"

解释：HTML规定可以为元素添加非标准的属性，但要添加前缀data-
目的：为元素提供与渲染无关的信息，或者语义信息。
-------- 属性可以任意添加和命名，只要以data-开头
访问：添加自定义属性之后，可以通过元素的dataset属性来访问自定义的值。

使用JavaScript操作dataset注意：

• 在添加或读取属性的时候需要去掉前缀data-
• 如果属性名称中还包含连字符(-)，需要转成驼峰命名方式，但如果在CSS中使用选择器，我们需要使用连字符格式

<div id="box"  data-name='ghostwu' data-age='22'   data-sex='man' >
        ghostwu tell you how to learn html5
</div>

     <script>
         var oBox = document.querySelector("#box");
         console.log( oBox.dataset ) ;
 
         var myName = oBox.dataset.name;
         var myAge = oBox.dataset.age;
         var mySex = oBox.dataset.sex;
 
         if( oBox.dataset ) {
             console.log( oBox.dataset );
         }
     </script>