使用新的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文件
我们的博客后台已经搭建好了,接下来我就要选择一个合适的模板做自己的博客,首先要定位你的博客是做什么用的,是属于什么行业,根据自己博客的定位选择适合的模板. 如果你是设计师,又会前端设计开发,那就可以自 ...
随机推荐
- 【sqli-labs】 less13 POST - Double Injection - Single quotes- String -twist (POST型单引号变形双注入)
报错 闭合掉括号 这关登录成功之后不显示登录的用户名密码了
- MVC 数据传递
public class HomeController : Controller { // GET: Home public ActionResult Index() //控制器名Home下默认的一个 ...
- Android内存优化————加载长图
项目中总会遇到加载长图的需求,图片的长度可能是手机长度的很多倍,也就是需要通过滑动来查看图片.比较简单的实现方式就是使用ScrollView来加载长图,但是这样做有一个很严重的问题,就是内存消耗严重. ...
- Ubuntu下解压(unzip)乱码的解决方法
在Windows上压缩的文件,是以Windows系统默认编码中文来压缩文件.由于zip文件中没有声明其编码,所以linux上的unzip一般以默认编码解压,中文文件名会出现乱码. 通过unzip -- ...
- /proc目录介绍
1. /proc目录 Linux 内核提供了一种通过 /proc 文件系统,在运行时访问内核内部数据结构.改变内核设置的机制.proc文件系统是一个伪文件系统,它只存在内存当中,而不占用外存空间.它以 ...
- 区分escape、encodeURI和encodeURIComponent
一.escape和它们不是同一类 简单来说,escape是对字符串(string)进行编码(而另外两种是对URL),作用是让它们在所有电脑上可读.编码之后的效果是%XX或者%uXXXX这种形式.其中 ...
- 关于使用element中的popup问题
高产似母猪..写完上篇看了几集新番就空虚了..零点时分决定爬起来,趁着清明假期能写多写点. 1.前言 我们知道弹出框都是在触发了某种条件后展示,而一个个的新的弹出框的展示,总是覆盖着上一个弹出框.实现 ...
- 3.Linux 系统目录结构
Linux 系统目录结构 登录系统后,在当前命令窗口下输入命令可以查看我们系统的默认文件列表: ls / 你会看到如下图所示: 树状目录结构: 以下是对这些目录的解释: /bin:bin是Bina ...
- C#中三种弹出信息窗口的方式
弹出信息框,是浏览器客户端的事件.服务器没有弹出信息框的功能. 方法一: asp.net页面如果需要弹出信息框,则需要在前台页面上注册一个javascript脚本,使用alert方法.使用Client ...
- asp怎么实现二级联动下拉菜单
rs为一级栏目的记录集 rs2为二级栏目的记录集 分别替换成你自己的记录集名称就好了 <script language="JavaScript"> var onecou ...