使用新的CSS类型对象模型

el.attributeStyleMap.set('padding', CSS.px(42));
const padding = el.attributeStyleMap.get('padding');
console.log(padding.value, padding.unit); // 42, 'px'
// Element styles.
el.attributeStyleMap.set('opacity', 0.3);
typeof el.attributeStyleMap.get('opacity').value === 'number' // Yay, a number!
// Stylesheet rules.
const stylesheet = document.styleSheets[0];
stylesheet.cssRules[0].styleMap.set('background', 'blue');
// All 3 of these are equivalent:
el.attributeStyleMap.set('opacity', 0.3);
el.attributeStyleMap.set('opacity', '0.3');
el.attributeStyleMap.set('opacity', CSS.number(0.3)); // see next section
// el.attributeStyleMap.get('opacity').value === 0.3
// StylePropertyMaps are iterable.
for (const [prop, val] of el.attributeStyleMap) {
console.log(prop, val.value);
}
// → opacity, 0.3
el.attributeStyleMap.has('opacity') // true
el.attributeStyleMap.delete('opacity') // remove opacity.
el.attributeStyleMap.clear(); // remove all styles.
if (window.CSS && CSS.number) {
// Supports CSS Typed OM.
}
使用新的CSS类型对象模型的更多相关文章
- Sql Server 新的日期类型
新的日期类型:是出现在2008中的在2005中没有的日期类型. 1,Date 数据类型 2,time 数据类型 3, datetime2 数据类型 4, datetimeoffset 数据类型 ...
- 【ElasticSearch】ES5新特性-keyword-text类型-查询区别
ES5新特性-keyword-text类型-查询区别 elasticsearch-head Elasticsearch-sql client junneyang (JunneYang) es keyw ...
- 如何增加新的PointT类型
博客转载自:http://www.pclcn.org/study/shownews.php?lang=cn&id=286 为了增加新的point类型,首先需要进行定义,例如: struct M ...
- C#中的扩展方法(向已有类添加方法,但无需创建新的派生类型)
C#中的扩展方法 扩展方法使你能够向现有类型"添加"方法,而无需创建新的派生类型.重新编译或以其他方式修改原始类型. 扩展方法是一种特殊的静态方法,但可以像扩展类型上的实例方法一样 ...
- Source Insight添加新的文件类型
1.前言 Source Insight这个软件工具功能非常强大,很适合用来分析一些大型的code工程,例如Linux内核源码,本文将简单介绍如何在Source Insight工程中添加一种新的文件类型 ...
- Python 3 新特性:类型注解——类似注释吧,反正解释器又不做校验
Python 3 新特性:类型注解 Crossin 上海交通大学 计算机应用技术硕士 95 人赞同了该文章 前几天有同学问到,这个写法是什么意思: def add(x:int, y:int) - ...
- Java将引入新的对象类型来解决内存利用问题
2022年Java将有什么新的特性和改进,我相信很多Java开发者都想知道.结合Java语言架构师布莱恩·格茨(Brian Goetz)最近的一些分享,胖哥给大家爆个料.老规矩,点赞走起. Valha ...
- 2022 年最受瞩目的新特性 CSS @layer 到底是个啥?
步入 2022,CSS 的新特性层出不穷,而最近在 CSS 圈最受瞩目的新特性,非 CSS @layer 莫属. 本文,将用最简洁的语言,快速让读者们搞懂,到底什么是 CSS @layer 新规范. ...
- 个人博客制作如何选择前端模板 thinkcmf后台加载新模板 CSS js文件
我们的博客后台已经搭建好了,接下来我就要选择一个合适的模板做自己的博客,首先要定位你的博客是做什么用的,是属于什么行业,根据自己博客的定位选择适合的模板. 如果你是设计师,又会前端设计开发,那就可以自 ...
随机推荐
- HDU_5690_快速幂,同余的性质
All X Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) Problem D ...
- 竞品分析」项目协作管理平台-Teambition和CORNERSTONE--深度体验
一.分析目的 通过分析2B产品中的团队协作管理软件的对比分析,用于为公司团队协作软件的选型做产考. 二.竞品归属市场概况 2.1.目标用户群及需求 主要面向企业用户,用于解决企业不同地域以及不同职能部 ...
- scrapy-redis 之处理异常
今天心情不好 不想多打字 自己看注释吧 from scrapy.http import HtmlResponse from twisted.internet import defer from twi ...
- jmeter3.1 压测
压测目标:error 为0,线程起到250,服务器配置达到最大 一.Jmeter3.1 压测 JMeter3.1提供一个用于生成HTML页面格式图形化报告的扩展模块.该模块支持通过两种方式生成多维度图 ...
- 【剑指Offer】4、重建二叉树
题目描述: 输入某二叉树的前序遍历和中序遍历的结果,请重建出该二叉树.假设输入的前序遍历和中序遍历的结果中都不含重复的数字.例如输入前序遍历序列{1,2,4,7,3,5,6,8}和中序遍历序列 ...
- jdk8时间格式处理
SimpleDateFormat 是线程不安全的类,一般不要定义为 static 变量,如果定义为 static,必须加锁,或者使用 DateUtils 工具类. 正例:注意线程安全,使用 DateU ...
- Qt Quick编程(1)
说道QML,不得不先说一下ECMAScript: ECMAScript语言的标准是由Netscape.Sun.微软.Borland等公司基于JavaScript和JScript锤炼.定义出来的. EC ...
- python第八周:socket网络编程
1.socket网络编程 1.1概念: 网络套接字是跨计算机网络的连接的端点.今天,计算机之间的大多数通信都基于互联网协议;因此大多数网络套接字都是Internet套接字.更准确地说,套接字是一个句柄 ...
- 【习题4-1 Uva1589】Xiangqi
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 车是可以被吃掉的... 注意这个情况. 其他的模拟即可. [代码] #include <bits/stdc++.h> u ...
- mysql绑定多个ip地址
http://jpuyy.com/2013/07/mysql-bind-multi-address.html mysql绑定多个ip地址 发表于2013 年 7 月 1 日 my.cnf中有选项bin ...