使用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/ ...
随机推荐
- 【UVa】1343 The Rotation Game(IDA*)
题目 题目 分析 lrj代码.... 还有is_final是保留字,害的我CE了好几发. 代码 #include <cstdio> #include <algorit ...
- Oracle导出CSV文件
-- 建立存储过程 CREATE OR REPLACE PROCEDURE SQL_TO_CSV ( P_QUERY IN VARCHAR2, -- PLSQL文 P_DIR IN VARCHAR2, ...
- 开始使⽤ZooKeeper的API
在之前的章节中,我们使用zkCli工具介绍了ZooKeeper的基本操作.从本章开始,我们将会看到在应用中如何通过API来进行操作.首先介绍一下如何使用ZooKeeper的API进行开发,展示如何创建 ...
- leetcode508
/** * Definition for a binary tree node. * public class TreeNode { * public int val; * public TreeNo ...
- ojective-c convert to pascal pattern
ojective-c convert to pascal pattern http://www.cnblogs.com/cnsoft/archive/2013/06/09/3128619.html C ...
- 跟我学算法-SVM(支持向量机)
支持向量机是一个点离决策边界越近,离决策面越远的问题 求解的过程主要是通过拉格朗日乘子法,来求解带约束的优化问题,在问题中涉及两个方面,一个是线性的,一个是非线性的,非线性的有 我们平时比较常见的高斯 ...
- @manyToOne.@oneToMany
@ManyToOne注解的这端,是多端 1.在注释@ManyToOne(cascade=CascadeType.REFRESH,optional=true)中将属性optional设置为true,这可 ...
- VS Code 在新Tabs打开文件
添加如下设置即可 "workbench.editor.enablePreview": false
- Spring3.0+Hibernate+Atomikos集成构建JTA的分布式事务--解决多数据源跨库事务
一.概念 分布式事务分布式事务是指事务的参与者.支持事务的服务器.资源服务器以及事务管理器分别位于不同的分布式系统的不同节点之上.简言之,同时操作多个数据库保持事务的统一,达到跨库事务的效果. JTA ...
- 【jdbc】【c3p0】c3p0三种配置方式【整理】
c3p0三种配置方式 c3p0的配置方式分为三种,分别是1.setters一个个地设置各个配置项2.类路径下提供一个c3p0.properties文件3.类路径下提供一个c3p0-config.xml ...