HTML5 自定义属性 data-*属性名一定要小写吗?
最近学习 javascript ,参考书籍是《 javascript 高级程序设计》第三版,在介绍自定义元素属性时书中给出了一个例子,如下:
<div id="myDiv" data-appId="12345" data-myname="Nicholas"></div>
理想情况下可以通过 myDiv.dataset.appId, myDiv.dataset.myname 访问数据,但是在实际测试的时候发现 appId 值为 undefined ,网上查了一下,说 HTML5 自定义属性不能包含大写字母,这种约束是不是不太合理?
如果我没记错的话,所有属性名都应该小写。
喔,忘了说,如果你要用 appId 访问,你应该写 data-app-id 。
没查,无责任猜测 data-app-id 在 dataset 里是 appId
所有标签属性,没有大小写区分,都是小写。 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 都是忽略大小写的。你要看很多年的网站,还会发现通篇标签全大写的呢。
HTML5 自定义属性 data-*属性名一定要小写吗?的更多相关文章
- 【翻译】详解HTML5 自定义 Data 属性
原标题:HTML5 Custom Data Attributes (data-*) 你是否曾经使用 class 或 rel 来保存任意的元数据,只为了使你的JavaScript更简单?如果你回答是的, ...
- js 获取html5的data属性
我以前一直以为只能用jquery的data()来获取 哈哈 是我太弱了 <!DOCTYPE html> <html> <head> <title>dat ...
- HTML5自定义data属性
可能大家在使用jquery mobile时,经常会看到data-role.data-theme等的使用,比如:通过如下代码即可实现页眉的效果: [html] <div data-role=&qu ...
- 【转载】HTML5自定义data属性
可能大家在使用jquery mobile时,经常会看到data-role.data-theme等的使用,比如:通过如下代码即可实现页眉的效果: [html] <div data-role= ...
- 【JSON.NET】json序列化小驼峰格式(属性名首字母小写)
废话少说,先上代码 var setting = new JsonSerializerSettings { ContractResolver = new Newtonsoft.Json.Serializ ...
- 【Newtonsoft.Json】json序列化小驼峰格式(属性名首字母小写)
我是一名 ASP.NET 程序员,专注于 B/S 项目开发.累计文章阅读量超过一千万,我的博客主页地址:https://www.itsvse.com/blog_xzz.html 只需要设置JsonSe ...
- HTML5 data属性
在HTML5中添加了data-*的方式来自定义属性,所谓data-*实际上上就是data-前缀加上自定义的属性名,命名可以用驼峰命名方式,但取值是必需全部使用小写,否则是undefinde 使用这样的 ...
- HTML5 自定义属性 data-* 和 jQuery.data 详解
新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得dat ...
- html5 data属性的使用
html5 data属性定义和用法 <ul> <li data-animal-type="bird">Owl</li> <li data- ...
随机推荐
- Spring Boot Web 自定义返回值(通用)
在项目下新建common.entity包,包中包含两个文件Result数据类,ResultCode接口文件 Result.class @Data @NoArgsConstructor public c ...
- liunx下Oracle安装
1. 引言 将近一个月没有更新博客了,最近忙着数据库数据迁移工作:自己在服务器上搭建了oracle数据库,一步步走下来遇见很多BUG:现在自己记录下,方便以后有用上的地方: 2. 准备工作 oracl ...
- Flanne
容器面临的问题 物理机A上的应用A看到的IP地址是容器A的,是172.17.0.2,在物理机B上的应用B看到的IP地址是容器B的,不巧也是172.17.0.2,当它们都注册到注册中心的时候,注册中心就 ...
- C# 8.0 中开启默认接口实现
原文:C# 8.0 中开启默认接口实现 当你升级到 C# 8.0 和 .NET Core 3.0 之后,你就可以开始使用默认接口实现的功能了. 从现在开始,你可以在接口里面添加一些默认实现的成员,避免 ...
- EF6 + MySql 建立项目引用失败
EF6 + MySql 建立项目 步骤 在项目中使用” NuGet” 包添加 EntityFramework 和 MySql.Data ,如下图 (1) 在NuGet界面中的“浏览”选项卡 ...
- Linux Shell/Bash wildcard通配符、元字符、转义符使用
说到shell通配符(wildcard),大家在使用时候会经常用到.下面是一个实例: 1 1 2 3 4 [chengmo@localhost ~/shell]$ ls a.txt b.txt ...
- Windows7平台下gitblit服务器安装
在日常开发工作中,我们通常使用版本控制软件管理团队的源代码,常用的SVN.Git.与SVN相比,Git有分支的概念,可以从主分支创建开发分支,在开发分支测试没有问题之后,再合并到主分支上去,从而避免了 ...
- Java自学-控制流程 break
Java的break语句 结束循环 示例 1 : break; 直接结束当前for循环 public class HelloWorld { public static void main(String ...
- 激活windows去掉右下角水印
激活windows去掉右下角水印 //需要隔一段时间执行一次 // 卸载已有的激活产品slmgr.vbs /upk // 重新按照激活产品slmgr /ipk NPPR9-FWDCX-D2C8J-H ...
- JavaWeb 之 EL表达式
EL 表达式 一.概述 1.概念 EL 表达式:Expression Language 表达式语言. 2.作用 替换和简化 jsp 页面中 java 代码的编写. 3.语法格式 ${表达式} 4.注意 ...