先声明  HTML5的自定义属性浏览器支持性不太好   目前只有firefox6+和chrome浏览器支持

元素除了自带的属性外 另外也可以加自定义属性   不过需要在前面加上data-

下面举个例子

<div class="btn user" data-appid='我是自定义属性的值'>我是div</div>

怎样获得   和更改自定义属性呢?  通过dataset属性

console.log(document.compatMode)
var div=document.querySelector('.btn');
console.log(div)
var appid=div.dataset.appid;
console.log(appid);//我是自定义属性的值
//更改一下自定义属性的值
div.dataset.appid=23456;
console.log(div.dataset.appid)//23456

目前支持  不好   不代表以后支持不好 了解点不算过

HTML5 自定义属性的更多相关文章

  1. HTML5自定义属性对象Dataset简介

    一.html5 自定义属性介绍 我之前翻译的“你必须知道的28个HTML5特征.窍门和技术”一文中对于HTML5中自定义合法属性data-已经做过些介绍,就是在HTML5中我们可以使用data-前缀设 ...

  2. Jquery 操作HTML5自定义属性data-*

    HTML5自定义属性规范的写法<a data-roleid="12"></a>,也可以直接写<a roleid="12">& ...

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

    最近学习 javascript ,参考书籍是< javascript 高级程序设计>第三版,在介绍自定义元素属性时书中给出了一个例子,如下:<div id="myDiv&q ...

  4. HTML5自定义属性操作

    一.自定义属性(html5标准)data-属性名称="属性值" 自定义属性的名称驼峰式命名规则需要用-隔开 自定义属性名称如果连在一起写,大写会自动转为小写 data-user=& ...

  5. HTML5自定义属性之data-*

    HTML5 增加了一项新功能是 自定义数据属性 ,也就是  data-* 自定义属性.在HTML5中我们可以使用以 data- 为前缀来设置我们需要的自定义属性,来进行一些数据的存放.当然高级浏览器下 ...

  6. HTML5 自定义属性 data-*介绍

    在HTML5之前HTML4我们也可以自定义属性通过setAttribute去设置或者直接写在HTML标签里面那么HTML5新增data-*(*可以替换成你喜欢的任意名字)属性有什么用呢? 更便的捷操作 ...

  7. HTML5自定义属性的设置与获取

    <div id="box" aaa="bbb" data-info="hello"></div> <body& ...

  8. html5——自定义属性

    自定义属性:添加前缀"data-" dataset属性:添加自定义属性后,通过元素的dataset属性来访问自定义属性的值(属性名没有data-前缀) data-name:data ...

  9. HTML5 自定义属性 data-* 和 jQuery.data 详解

    新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得dat ...

随机推荐

  1. Vue获取DOM元素的属性值

    项目中需要做一个小弹层,如下图: 我需要知道点击元素距离顶部的值,再计算弹层的top值,如下图: 在vue中如何获取到DOM元素距离窗口顶部的值呢? 1.通过$event获取 html: <di ...

  2. 一、Bitcoin比特币与BlockChain区块链技术

    一.比特币历史 2008 年 10 月 31 日,一个网名叫中本聪(英文翻译过来滴)的家伙发布比特币唯一的白皮书:<Bitcoin:A Peer-to-PeerElectronic Cash S ...

  3. java+Quartz实现定时任务

    1.首先:导入quartz相关的jar包,这里我用的是maven构建的项目,pom.xml文件导入如下: <dependency> <groupId>org.quartz-sc ...

  4. nginx负载均衡二:配置

    配置方法一(可用): upstream tomcatserver1 { server ; server 192.168.70.172; server 192.168.70.173 down; serv ...

  5. Centos7 防火墙常用配置及说明

    一. Centos7和Centos6 防火墙的区别: 使用的工具不一样了.Centos6 使用的是iptables ,Centos7 使用的是filewall iptables 用于过滤数据包,属于网 ...

  6. 3、一、Introduction(入门):2、Device Compatibility(设备兼容性)

    2.Device Compatibility(设备兼容性)   Android is designed to run on many different types of devices, from ...

  7. Python scipy 计算短时傅里叶变换(Short-time Fourier transforms)

    计算短时傅里叶变换(STFT) scipy.signal.stft(x,fs = 1.0,window ='hann',nperseg = 256,noverlap = None,nfft = Non ...

  8. git diff命令详解

    1 如下命令: [devel@localhost pontus]$ git diff webserver/web_pontus/app_api/v0/urls.py# 显示如下: diff --git ...

  9. 7.9CSS总结

    2018-7-9 18:01:18 1.类选择器是 用  .      .xxx{}  (ps,公司常用的是类选择  ) 2.id选择器是用  #   #xx{}  (id选择器并不常用) 3.css ...

  10. Redis一次数据丢失

    一台Redis服务器,4核,16G内存且没有任何硬件上的问题.持续高压运行了大约3个月,保存了大约14G的数据,设置了比较完备的Save参数.而就是这台主机,在一次重起之后,丢失了大量的数据,14G的 ...