<thead id="rrjt3"></thead>
      <progress id="rrjt3"><dfn id="rrjt3"></dfn></progress>

      <em id="rrjt3"></em>

        <address id="rrjt3"><ins id="rrjt3"><dfn id="rrjt3"></dfn></ins></address>
          <i id="rrjt3"></i>

        HTML5新特性: 自定義屬性前綴data-以及dataset的使用

        時間:2021-01-11 10:54:49 類型:HTML/CSS
        字號:    

          HTML5規定可以為元素添加非標準的屬性,但要添加前綴 data- ,目的是為元素提供與渲染無關的

          信息,或者提供語義信息。這些屬性可以任意添加、隨便命名,只要以 data- 開頭即可

          添加了自定義屬性之后,可以通過元素的 dataset 屬性來訪問自定義屬性的值

        <div id="test" data-name='莊子' data-age='18' , data-sex='男'>Hello ,  Welcome to NanChang YaTeng</div>
                <script>
                    var datas = document.querySelector("#test");
                    var myName = datas.dataset.name;
                    var myAge = datas.dataset.age;
                    var mySex = datas.dataset.sex;
        
                    console.log("名字:" + myName + "年齡:" + myAge + "性別:" + mySex);
                </script>

        結果:

        名字:莊子年齡:18性別:男

        黄网站免费 <