使用新的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文件
我们的博客后台已经搭建好了,接下来我就要选择一个合适的模板做自己的博客,首先要定位你的博客是做什么用的,是属于什么行业,根据自己博客的定位选择适合的模板. 如果你是设计师,又会前端设计开发,那就可以自 ...
随机推荐
- 在Android 上运行 openCV ,并做灰度变化的一个例子
OpenCVImageProcessing1. 导入Opencv的 androrid SDK灰度算法 OpenCVImageProcessing 导入opencv Jar包,配置OpenCVLibra ...
- MySQL+Keepalived实现主主高可用方案
Mysql主主高可用方案 master配置 [root@master ~]# yum -y install keepalived [root@master ~]# vim /etc/keepalive ...
- 【转载】JSTL 标签大全详解
版权声明:本文为博主原创文章,转载请注明出处,冷血之心的博客. https://blog.csdn.net/qq_25827845/article/details/53311722 (尊重劳动成果,转 ...
- transparent
transparent属性用来指定全透明色彩
- Html 页面刷新后出现闪动
Html 页面刷新后,或跳转后,出现闪动,抖动问题 1.查看有没有用到新字体,新字体链接位置是否存在 如: @font-face { font-family: "AvantGarde-Dem ...
- Google Shell Style Guide
转自:http://google.github.io/styleguide/shell.xml Shell Style Guide Revision 1.26 Paul Armstrong Too m ...
- Vue学习之路第二十篇:Vue生命周期函数-组件创建期间的4个钩子函数
1.每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等.同时在这个过程中也会运行一些叫做生命周期钩子的函数 ...
- [luogu 4886] 快递员
传送门 Solution 虽然不是点分治但用类似点分治的方法不断接近正确结果 Code // luogu-judger-enable-o2 #include <cstdio> #inclu ...
- 47.serch基本语法
主要知识点 1._search api基本语法 2.http协议中get请求带上request body 一.search api的基本语法 1.GET /_search {所传递的参 ...
- Vue CLI 3 中文文档
翻译文档 文档翻译全貌 前言 之前写了一篇Vue CLI 3.x 版本的简单体验,当时文档还不全,具体的使用方法并不是很清楚,大概是2月7号,收到Vue CLI 3接近Beta版的提示,作者尤雨溪也讲 ...