HTML5 data属性
在HTML5中添加了data-*的方式来自定义属性,所谓data-*实际上上就是data-前缀加上自定义的属性名,命名可以用驼峰命名方式,但取值是必需全部使用小写,否则是undefinde 使用这样的结构可以进行数据存放。使用data-*可以解决自定义属性混乱无管理的现状。
小写
<div id="app" data-app="app">
驼峰式
let cour = document.querySelector('#cour');
获取data-的值
let app = document.querySelector('#app');
let cour = document.querySelector('#cour');
console.log (app.dataset.app);
console.log (cour.dataset.courcd);
HTML5 data属性的更多相关文章
- html5 data属性的使用
html5 data属性定义和用法 <ul> <li data-animal-type="bird">Owl</li> <li data- ...
- 【翻译】详解HTML5 自定义 Data 属性
原标题:HTML5 Custom Data Attributes (data-*) 你是否曾经使用 class 或 rel 来保存任意的元数据,只为了使你的JavaScript更简单?如果你回答是的, ...
- js 获取html5的data属性
我以前一直以为只能用jquery的data()来获取 哈哈 是我太弱了 <!DOCTYPE html> <html> <head> <title>dat ...
- HTML5 学习总结(二)——HTML5新增属性与表单元素
一.HTML5新增属性 1.1.contextmenu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> & ...
- HTML5 学习笔记(二)——HTML5新增属性与表单元素
目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...
- JS组件系列——使用HTML标签的data属性初始化JS组件
前言:最近使用bootstrap组件的时候发现一个易用性问题,很多简单的组件初始化都需要在JS里面写很多的初始化代码,比如一个简单的select标签,因为仅仅只是需要从后台获取数据填充到option里 ...
- HTML data属性简介以及低版本浏览器兼容算法
实例 使用 data-* 属性来嵌入自定义数据: <ul> <li data-animal-type="bird">Owl</li> <l ...
- HTML5学习总结——HTML5新增属性与表单元素
一HTML5新增属性 1.1contcxtmcnu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> < ...
- HTML 5:你必须知道的data属性
原文:All You Need to Know About the HTML5 Data Attribute 译文:你必须知道HTML 5 的Data属性 译者:dwqs HTML 5的Data属性可 ...
随机推荐
- mysql-5.7.16-winx64解压版安装超详细图文教程
1.安装: 将下载的mysql-5.7.16-winx64压缩包解压后的整个目录放在自己喜欢的位置,我的放在D盘根目录下 2.配置: 进入mysql-5.7.16-winx64目录,将里面的my-de ...
- org.springframework.boot.builder.SpringApplicationBuilder.<init>
新建了一个Spring cloud项目,启动时报错org.springframework.boot.builder.SpringApplicationBuilder.<init> 翻阅资料 ...
- mysql给查询的结果添加序号
1.法一: select (@i:=@i+1) i,a.url from base_api_resources a ,(select @i:=0) t2 order by a.id de ...
- JDK源码阅读顺序
很多java开发的小伙伴都会阅读jdk源码,然而确不知道应该从哪读起.以下为小编整理的通常所需阅读的源码范围. 标题为包名,后面序号为优先级1-4,优先级递减 1.java.lang 1) Obj ...
- jquery给按钮绑定事件
JQuery: $(function(){ $("#btn1").bind("click",function(){ $("#div1").s ...
- Boolean类型
Boolean类型是与布尔值对应的引用类型.如果要创建Boolean对象,语法如下: var booleanObject = new Boolean(true); Boolean类型的实例重写了val ...
- APP-7-百度地图移动轨迹
1.代码部分 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <me ...
- es6新特性之箭头函数
<script> { // es3,es5 var evens = [1, 2, 3, 4, 5]; var odds = evens.map(function (v) { return ...
- Xcode 新建bundle id不同的且app图标也不同的新的target的步骤
方法一: duplicate一个target 修改target配置文件中的bundle id,app icon图标文件位置(必要时重命名app icon文件名),plist文件位置,entitleme ...
- echarts-颜色渐变
图形的颜色. 默认从全局调色盘 option.color 获取颜色 颜色可以使用 RGB 表示,比如 'rgb(128, 128, 128)',如果想要加上 alpha 通道表示不透明度,可以使用 R ...