• 请不要在回答技术问题时复制粘贴 AI 生成的内容
tesion99
V2EX  ›  程序员

HTML5 自定义属性 data-*属性名一定要小写吗?

  •  
  •   tesion99 · Sep 1, 2015 · 7157 views
    This topic created in 3939 days ago, the information mentioned may be changed or developed.

    最近学习 javascript ,参考书籍是《 javascript 高级程序设计》第三版,在介绍自定义元素属性时书中给出了一个例子,如下:
    <div id="myDiv" data-appId="12345" data-myname="Nicholas"></div>
    理想情况下可以通过 myDiv.dataset.appId, myDiv.dataset.myname 访问数据,但是在实际测试的时候发现 appId 值为 undefined ,网上查了一下,说 HTML5 自定义属性不能包含大写字母,这种约束是不是不太合理?

    17 replies    2015-09-01 14:33:05 +08:00
    oott123
        1
    oott123  
       Sep 1, 2015
    如果我没记错的话,所有属性名都应该小写。
    oott123
        2
    oott123  
       Sep 1, 2015
    喔,忘了说,如果你要用 appId 访问,你应该写 data-app-id 。
    sunjourney
        3
    sunjourney  
       Sep 1, 2015
    没查,无责任猜测 data-app-id 在 dataset 里是 appId
    SourceMan
        4
    SourceMan  
       Sep 1, 2015
    @sunjourney 无责任表示同意
    adjusted
        5
    adjusted  
       Sep 1, 2015
    三楼正解
    ThisDay
        6
    ThisDay  
       Sep 1, 2015
    负责的跟你说,三楼正解
    learnshare
        7
    learnshare  
       Sep 1, 2015
    标签、属性名 都建议用小写
    otakustay
        8
    otakustay  
       Sep 1, 2015
    属性和标签名大小写不敏感,你全大写也会变回小写
    gongpeione
        9
    gongpeione  
       Sep 1, 2015
    三楼说的对
    Sivan
        10
    Sivan  
       Sep 1, 2015
    属性名不敏感,属性值别混着写就可以。
    iyangyuan
        11
    iyangyuan  
       Sep 1, 2015
    试试不就知道了。。。
    iamcho
        12
    iamcho  
       Sep 1, 2015
    我 data 都没用,直接 随便取,比如 lusir ,一样可以拿到值
    kisshere
        13
    kisshere  
       Sep 1, 2015 via Android
    Internet explorer 对你说,你大写小写管我屁事啊!
    keakon
        14
    keakon  
       Sep 1, 2015
    没记错的话, HTML 中的属性名不区分大小写,但用 DOM 获取时,需要用小写。
    tesion99
        15
    tesion99  
    OP
       Sep 1, 2015
    @sunjourney data-app-id 在 dataset 中是表示为 appId 的形式,把自定义变量转换为了 Camel-Case 的形式
    morethansean
        16
    morethansean  
       Sep 1, 2015
    @tesion99 所有标签属性,没有大小写区分,都是小写。 dataset 自动把 - 转换为驼峰。类似的还有 css 中的 style 属性,例如 background-color ,在 js 中对应 backgroundColor. 当然你会发现你要是执意要把 element.style.backgroundColor 写成 element.style['background-color'],在 chrome 中也是可以生效的,但没查证不知道是不是标准的 behavior. 总之遵循规范就是了,用 data-app-id, data-my-name 作属性, js 中直接 ele.dataset.appId 访问。除了某几个例如 id 之类的 attribute ,其他的非 dataset 的只能通过调用 setAttribute 或者 getAttribute 去访问。而且如前文所说 attribute 都是忽略大小写的。你要看很多年的网站,还会发现通篇标签全大写的呢。
    tesion99
        17
    tesion99  
    OP
       Sep 1, 2015
    @morethansean 谢谢了!
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2991 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 74ms · UTC 03:49 · PVG 11:49 · LAX 20:49 · JFK 23:49
    ♥ Do have faith in what you're doing.