• <ol id="gebcs"></ol>
    <track id="gebcs"><i id="gebcs"></i></track>

    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性別:男

    黄片基地 <