使用JavaScript获取CSS伪元素属性
我们可以通过DOM元素的 style 属性获取基本的CSS样式值, 但怎么获取CSS伪元素属性呢? 如下
// 获取 .element:before 的 color 值
var color = window.getComputedStyle(
document.querySelector('.element'), ':before'
).getPropertyValue('color'); // 获取 .element:before 的 content 值
var content = window.getComputedStyle(
document.querySelector('.element'), ':before'
).getPropertyValue('content');
使用JavaScript获取CSS伪元素属性的更多相关文章
- JavaScript 修改 CSS 伪类属性
背景 有时候我们希望通过JS代码控制伪类属性, 确苦于对策 实际上可通过向document.head中添加style子元素来实现 演示 function css(style_text) { var s ...
- 重温JavaScript获取CSS样式的方法(兼容各浏览器)
众所周知,CSS样式有三种类型:行内样式.内部样式和外部样式,JavaScript获取CSS样式时分为两种情况:行内样式获取法 和 非行内样式获取法 . 一.行内样式获取相对简单,通过element. ...
- css 伪元素分享!!!
最近接触到的css 伪元素觉得还算不错 分享下: 1.清楚内盒浮动设置: ;} .back_list ul:after{;visibility: hidden;}/*清楚内盒浮动设置*/ 2.伪元素a ...
- jquery选择伪元素属性的方法
CSS伪元素不是DOM元素,因此你无法直接选择到它们 一个方法是为该元素添加新类,并通过设置新类的属性来达到改变伪元素属性的效果: .checkboxWrapper.selected::before{ ...
- CSS 伪元素&伪类
单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪元素 伪元素 属性 描述 CSS :first-letter 向文本的第一个字母添加特殊样式 1 :first-line 向文本的首行添加特殊 ...
- CSS 伪元素
CSS伪元素是用来添加一些选择器的特殊效果. 语法 伪元素的语法: selector:pseudo-element {property:value;} CSS类也可以使用伪元素: selector.c ...
- js如何控制css伪元素内容(before,after)
曾经遇到的问题,在对抗UC浏览器屏蔽需要把内容输出到css 伪元素中输出.有个疑问如何用js控制它.于是在segmentfault提问,如下是对问题的整理: 如何用js控制css伪类after 简单粗 ...
- css伪元素用法大全
本文主要讲解css伪元素的用法,有需要的朋友可以阅读此文.本文讲解的伪元素有:before,after. 什么是伪元素(Pseudo element)? 伪元素不是真正的元素,不存在与文档之中,所以j ...
- js分析 汽_车_之_家 js生成css伪元素 hs_kw44_configUS::before
0.参考 https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements https://developer.mozilla.org/ ...
随机推荐
- 工具类MyBatisUtils创建SqlSessionFactory
package com.js.ai.modules.pointwall.interfac; import java.io.IOException; import java.io.InputStream ...
- file_get_content服务器对服务器二进制文件上传
1.file_get_contents函数可安全用于二进制对象,适用服务器对服务器文件是上传场景 base64_encode(file_get_contents('1268879774AaCl4wIE ...
- requests模块session处理cookie 与基于线程池的数据爬取
引入 有些时候,我们在使用爬虫程序去爬取一些用户相关信息的数据(爬取张三“人人网”个人主页数据)时,如果使用之前requests模块常规操作时,往往达不到我们想要的目的,例如: #!/usr/bin/ ...
- rabbitMQ消息队列1
rabbitmq 消息队列 解耦 异步 优点:解决排队问题 缺点: 不能保证任务被及时的执行 应用场景:去哪儿, 同步 优点:保证任务被及时的执行 缺点:排队问题 大并发 Web nginx 1000 ...
- springboot-shiro chapter02——springboot webmvc jsp
简介:这一节主要涉及spring boot 支持jsp, 由于对spring boot不太熟悉,走了一些弯路. 环境:IDEA15+JDK1.8+Maven3+ 代码: https://git.osc ...
- Asp.net 的工作原理
转:http://www.cnblogs.com/linjiancun/archive/2010/09/14/1825662.html 1.1.1 Asp.net 的工作原理 ...
- NHibernate-NativeSQL
一.调用方式 1.创建查询 var sql = session.CreateSQLQuery("SELECT * FROM sns_User WHERE UserName LIKE :use ...
- 词法解析 用reactjs和bootstrap创建页面IDE
- cdoj1088-王之迷宫 (三维迷宫最短路径)【BFS】
http://acm.uestc.edu.cn/#/problem/show/1088 王之迷宫 Time Limit: 3000/1000MS (Java/Others) Memory Li ...
- Spark 性能相关参数配置详解-shuffle篇
随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 在Spark的官方文档http://spark.apache.org/docs/latest/configuration. ...