HTML5 dataset All In One
HTML5 dataset All In One
dataset
https://developer.mozilla.org/en-US/docs/Web/API/HTMLOrForeignElement/dataset#Name_conversion
<!-- DOM & dataset -->
<button data-unique-id="007"> click me get the button's id!</button>
<!-- camelCase to dash-style conversion -->
const log = console.log;
const btn = document.querySelector(`[data-unique-id="007"]`);
// ️ dash-style to camelCase conversion
const uid = btn.dataset.uniqueId;
log(`button unique id =`, uid);
DOMStringMap
https://developer.mozilla.org/en-US/docs/Web/API/DOMStringMap
CSS attr() & HTML5 dataset
https://developer.mozilla.org/en-US/docs/Web/CSS/attr()
https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes
article::before {
content: attr(data-parent);
}
<article
id="electric-cars"
data-columns="3"
data-index-number="12314"
data-parent="cars">
...
</article>
CSS Functions
CSS 函数
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Functions
dataset & data-* attributes
refs
https://developer.mozilla.org/en-US/docs/Web/API/HTMLOrForeignElement/dataset#Name_conversion
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！
HTML5 dataset All In One的更多相关文章
- HTML5自定义属性对象Dataset简介
一.html5 自定义属性介绍 我之前翻译的“你必须知道的28个HTML5特征.窍门和技术”一文中对于HTML5中自定义合法属性data-已经做过些介绍,就是在HTML5中我们可以使用data-前缀设 ...
- Html5 dataset--自定义属性
dataset--自定义属性 HTMLElement.dataset data-*属性集 元素上保存数据 <div id="user" data-id="12345 ...
- HTML5 自定义属性 data-* 和 jQuery.data 详解
新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得dat ...
- HTML5 自定义属性 data-*介绍
在HTML5之前HTML4我们也可以自定义属性通过setAttribute去设置或者直接写在HTML标签里面那么HTML5新增data-*(*可以替换成你喜欢的任意名字)属性有什么用呢? 更便的捷操作 ...
- 使用 HTML5 & CSS 实现一个自定义开关按钮 switch button
使用 HTML5 & CSS 实现一个自定义开关按钮 switch button switch button <div class="switch"> < ...
- imagepool前端图片加载管理器(JavaScript图片连接池)
前言 imagepool是一款管理图片加载的JS工具,通过imagepool可以控制图片并发加载个数. 对于图片加载,最原始的方式就是直接写个img标签,比如:<img src="图片 ...
- Jsoup 使用教程：数据抽取
1.使用DOM方法来遍历一个文档 问题 你有一个HTML文档要从中提取数据,并了解这个HTML文档的结构. 方法 将HTML解析成一个Document之后,就可以使用类似于DOM的方法进行操作.示例代 ...
- jQuery源码解读 - 数据缓存系统：jQuery.data
jQuery在1.2后引入jQuery.data(数据缓存系统),主要的作用是让一组自定义的数据可以DOM元素相关联——浅显的说:就是让一个对象和一组数据一对一的关联. 一组和Element相关的数据 ...
- 使用 jsoup 解析HTML
// 参考资料: // http://www.jb51.net/article/43485.htm @Test public void AnalysisHTMLByString() { String ...
随机推荐
- (04)-Python3之--字典（dict）操作
1.定义 字典的关键字:dict 字典由多个键和其对应的值构成的 键-值 对组成,每个键值对用冒号 : 分割,每个键值对之间用逗号 , 分割,整个字典包括在花括号 {} 中. {key1:value1 ...
- jQuery 页面滚动 吸顶 和 吸底
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 请不要继续将数据库称为 CP 或 AP - 掘金 https://juejin.im/post/6844903878102614030
请不要继续将数据库称为 CP 或 AP - 掘金 https://juejin.im/post/6844903878102614030
- Enabling Session Persistence 粘性会话
NGINX Docs | HTTP Load Balancing https://docs.nginx.com/nginx/admin-guide/load-balancer/http-load-ba ...
- java native：Java本地方法调用（jni方式）
https://www.cnblogs.com/zh1164/p/6283831.html
- LOJ10141染色
SDOI 2011 染色 给定一棵有 n 个节点的无根树和 m 个操作,操作共两类. 将节点 a 到节点 b 路径上的所有节点都染上颜色: 询问节点 a 到节点 b 路径上的颜色段数量,连续相同颜色的 ...
- php中两个函数可能导致的sql注入
sprintf https://www.php.net/manual/zh/function.sprintf.php 漏洞demo: <?php $name = addslashes($_GET ...
- 十五：SpringBoot-配置Actuator组件,实现系统监控
SpringBoot-配置Actuator组件,实现系统监控 1.Actuator简介 1.1 监控组件作用 1.2 监控分类 2.SpringBoot整合Actuator 2.1 核心依赖Jar包 ...
- Prometheus—告警altermanger
Prometheus-告警altermanger 1.告警altermanger装配 2.告警Mysql 3.Prometheus针对nodes告警规则配置 相关内容原文地址链接: 51CTO:wfw ...
- MariaDB数据库----查（实例演示）
MariaDB数据--查 SQl语句执行顺序 基础查询 查询 添加数据 MariaDB [test]> insert into huluwa values -> (1 ,'葫芦爷爷',73 ...