我们可以通过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伪元素属性的更多相关文章

  1. JavaScript 修改 CSS 伪类属性

    背景 有时候我们希望通过JS代码控制伪类属性, 确苦于对策 实际上可通过向document.head中添加style子元素来实现 演示 function css(style_text) { var s ...

  2. 重温JavaScript获取CSS样式的方法(兼容各浏览器)

    众所周知,CSS样式有三种类型:行内样式.内部样式和外部样式,JavaScript获取CSS样式时分为两种情况:行内样式获取法 和 非行内样式获取法 . 一.行内样式获取相对简单,通过element. ...

  3. css 伪元素分享!!!

    最近接触到的css 伪元素觉得还算不错 分享下: 1.清楚内盒浮动设置: ;} .back_list ul:after{;visibility: hidden;}/*清楚内盒浮动设置*/ 2.伪元素a ...

  4. jquery选择伪元素属性的方法

    CSS伪元素不是DOM元素,因此你无法直接选择到它们 一个方法是为该元素添加新类,并通过设置新类的属性来达到改变伪元素属性的效果: .checkboxWrapper.selected::before{ ...

  5. CSS 伪元素&伪类

    单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪元素 伪元素 属性 描述 CSS :first-letter 向文本的第一个字母添加特殊样式 1 :first-line 向文本的首行添加特殊 ...

  6. CSS 伪元素

    CSS伪元素是用来添加一些选择器的特殊效果. 语法 伪元素的语法: selector:pseudo-element {property:value;} CSS类也可以使用伪元素: selector.c ...

  7. js如何控制css伪元素内容(before,after)

    曾经遇到的问题,在对抗UC浏览器屏蔽需要把内容输出到css 伪元素中输出.有个疑问如何用js控制它.于是在segmentfault提问,如下是对问题的整理: 如何用js控制css伪类after 简单粗 ...

  8. css伪元素用法大全

    本文主要讲解css伪元素的用法,有需要的朋友可以阅读此文.本文讲解的伪元素有:before,after. 什么是伪元素(Pseudo element)? 伪元素不是真正的元素,不存在与文档之中,所以j ...

  9. js分析 汽_车_之_家 js生成css伪元素 hs_kw44_configUS::before

    0.参考 https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements https://developer.mozilla.org/ ...

随机推荐

  1. PHP代码覆盖率

    一  安装php环境 二 统计php代码覆盖率 1 需要安装xdebug 安装步骤: http://www.jb51.net/article/116419.htm 测试环境 LNMP 军哥一键包1.3 ...

  2. 不同的类UNIX操作系统密码破解方法介绍

    (一)Linux 系统密码破解 1.在grub选项菜单按E进入编辑模式 2.编辑kernel那行 /init 1 (或/single) 3.按B重启 4.进入后执行下列命令 root@#passwd ...

  3. C# 设计模式-工厂模式(Factory)

    1.工厂模式 factory从若干个可能类创建对象. 例如:如果创建一个通信类接口,并有多种实现方式,可以使用factory创建一个实现该接口的对象,factory可以根据我们的选择,来创建适合的对象 ...

  4. ListView 中 的 分页

     Django Pagination 简单分页 当博客上发布的文章越来越多时,通常需要进行分页显示,以免所有的文章都堆积在一个页面,影响用户体验.Django 内置的 Pagination 能够帮助我 ...

  5. mysql 挑选列导入

    insert into boleht_development.`htprojects`(id,pname,`general`,imgsrc,whatwedo,howwedo,bp) select ci ...

  6. jaegeropentracing的Java-client完整分布式追踪链

    jaegeropentracing的Java-client完整分布式追踪链,在分布式系统中透传trace信息 之前文章记录了jaegeropentracing的Java-client追踪链在单系统中的 ...

  7. 简单的mysql热备

    最近一直担心数据出问题,还好领导给了一台备用机,装好mysql后搜了下mysq热备相关的帖子,看似好繁琐,自己大概配置了一下擦发现起始很简单! 下边就是步骤了! 1.修改主从mysql配置文件,在my ...

  8. Java设计模式学习01——单例模式(转)

    原地址:http://blog.csdn.net/xu__cg/article/details/70182988 Java单例模式是一种常见且较为简单的设计模式.单例模式,顾名思义一个类仅能有一个实例 ...

  9. Agile1001社区10月份活动:一张图解读企业级产品思维

    活动信息 主题:一张图解读企业级产品思维 地点:北京市海淀区苏州街3号大恒科技大厦南座4层 时间: 2017-10-15 14:00 - 17:00 报名链接:http://www.hdb.com/p ...

  10. Texture Format全解析

    [Texture Format全解析] What internal representation is used for the texture. This is a tradeoff between ...