Html5 自定义数据属性
html5 可以为元素添加自定义属性,但是要添加前缀data-。(下面这个例子中的自定义属性的命名,其实是不规范的,不应该包含大写字符,例如:data-myName 应改命名为:data-myname. 应为我们在维护别人的代码,所以就会遇到如下的问题。)
<div class="disabled myClass" id="mDiv" data-appId='' 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);//
alert(div.dataset.myname);//mDiv
为了省去不必要的麻烦,推荐做法 是使用getAttribute() 自己来取值(俗话说自己动手丰衣足食):
var div = document.getElementById("mDiv");
var temp = div.getAttribute("data-appId");
alert(temp);//123456
<b>test</b>
Html5 自定义数据属性的更多相关文章
- html5 自定义数据属性 ,也就是 data-* 自定义属性---笔记。
html5 自定义数据属性 ,也就是 data-* 自定义属性. 例如 <div data-last-value="43" data-hidden="true& ...
- 如何使用HTML5自定义数据属性
在本文中,我将向你介绍如何使用HTML5自定义数据属性.我还将向你介绍一些开发人员在工作中经常使用的优秀实例. 为什么需要自定义数据属性? 很多时候我们需要存储一些与不同DOM元素相关联的信息.这些信 ...
- 【翻译】详解HTML5 自定义 Data 属性
原标题:HTML5 Custom Data Attributes (data-*) 你是否曾经使用 class 或 rel 来保存任意的元数据,只为了使你的JavaScript更简单?如果你回答是的, ...
- HTML5自定义select标签样式的方法
HTML5自定义select标签样式的方法 -webkit-appearance: none; 这个东西可以隐藏箭头 不过手机端就直接 设置透明度为0就行了(如果这种做法比前面个要麻烦点 毕竟还要对他 ...
- 基于HTML5自定义文字背景生成QQ签名档
分享一款利用HTML5实现的自定义文字背景应用,首先我们可以输入需要显示的文字,并且为该文字选择一张背景图片,背景图片就像蒙版一样覆盖在文字上.点击生成QQ签名档即可将文字背景融为一体生成另外一张图片 ...
- html5 自定义验证信息
h5 为表单新增了很多类型,及属性. 根据这些新增的类型及属性 h5也为我们提供了验证这些数据的js函数,这些验证表单的函数都存在了ValidityState对象中,接下来让我们一起来了解一下这些 ...
- 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= ...
- html5 自定义标签取值
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 关于linux下内存使用的一些疑惑[转载]
Linux内存机制-Cache与Buffer 在linux中经常发现空闲内存很少,似乎所有的内存都被系统占用了,表面感觉内存不够用了,其实不然.这是Linux内存管理的一个优秀特性,在这方面,区别于w ...
- iOS多线程系列(2)
前面了iOS的NSThread方法来实现多线程,这篇就简单的讲讲NSOperation和NSOperationQueue. NSOperation是一个抽象类,定义一个要执行的任务.NSOperati ...
- uva10934 Dropping water balloons
//好久没做题 一直没状态 然后刷了个水题玩玩 //寒假集训和校赛都做到了类似的题目 然而当时并不会 (其实现在也不会 题意:有k个气球和一个n层高的楼,气球有硬度,在某曾会恰好摔碎,问至少多少次实验 ...
- Oracle 中单引号和双引号的区别
问题产生原因: insert into t_Cluster_Showresult(Outhostname,Domainlist,Iplist,Classify) values ("20145 ...
- kubuntu/ubuntu下安装fcitx输入法
1.添加fcitx源(官方的源是旧版,不推荐使用) sudo gedit /etc/apt/sources.list 在sources.list文件中尾部添加: deb http://ppa.laun ...
- Hibernate 、多表关联映射-组件关联映射(component)
组件关联映射可以将一些简小的数据与主题放在一个表中,例如firstName 和LastName这两个结合在一起可以组成一个名字,但是再分别将这两个再建一个表就不太合适了,这个时候可以用到组件关联映射: ...
- 项目积累——Blockingqueue,ConcurrentLinkedQueue,Executors
背景 通过做以下一个小的接口系统gate,了解一下mina和java并发包里的东西.A系统为javaweb项目,B为C语言项目,gate是本篇须要完毕的系统. 需求 1. A为集群系统,并发较高,会批 ...
- C#.NET学习笔记1---C#.NET简介
C#.NET学习笔记1---C#.NET简介 技术qq交流群:JavaDream:251572072 教程下载,在线交流:创梦IT社区:www.credream.com -------------- ...
- MySQL常用指令
1.win下启动MySQL 命令行下输入: mysql –h localhost –u root -p / mysql -uroot -p 2.MySql下建表 输入命令 show database ...
- SqlServer之触发器
1.触发器之理论: 触发器(Trigger)是一种特殊类型的存储过程,是在用户对某一种表的数据进行UPDATE.INSERT 和 DELETE 操作时被触发执行的一段程序.触发器有助于强制引用完整性, ...