zoukankan      html  css  js  c++  java
  • Html5 自定义数据属性

    html5 可以为元素添加自定义属性,但是要添加前缀data-。(下面这个例子中的自定义属性的命名,其实是不规范的,不应该包含大写字符,例如:data-myName 应改命名为:data-myname. 应为我们在维护别人的代码,所以就会遇到如下的问题。)

      <div class="disabled myClass" id="mDiv" data-appId='12456' data-myName="mDiv">class test</div>

    定义好属性之后该如何访问属性呢,有两种方式:1.通过元素的dataset 属性来直接访问属性值。这也就是可能会有问题的地方!!! 使用下面的代码执行不成功。

                    var div = document.getElementById("mDiv");
                    alert(div.dataset.appId);//undefined
                    alert(div.dataset.myName);//undefined

    正确的代码:

                    var div = document.getElementById("mDiv");
                    alert(div.dataset.appid);//123456
                    alert(div.dataset.myname);//mDiv

    为了省去不必要的麻烦,推荐做法 是使用getAttribute() 自己来取值(俗话说自己动手丰衣足食):

    var div = document.getElementById("mDiv");
    var temp = div.getAttribute("data-appId");
     alert(temp);//123456

     <b>test</b>

  • 相关阅读:
    [poj 1741]Tree 点分治
    [bzoj 3251]树上三角形
    [bzoj 3687]简单题 bitset的运用
    HDU [P5015] 233 Matrix
    POJ 3233
    洛谷 [P3629] 巡逻
    POJ 2728 Desert King
    洛谷 [P2886] 牛继电器Cow Relays
    POJ 1734 Sightseeing trip
    洛谷 [P3008] 道路与航线
  • 原文地址:https://www.cnblogs.com/bg57/p/4062281.html
Copyright © 2011-2022 走看看