利用currentStyle()和ComputedStyle()

1 通常用法:

balance为类名

window.getComputedStyle(document.querySelector(".balance"), null).backgroundColor;

window.getComputedStyle(document.querySelector(".balance"), null).fontSize;

2 封装一个函数:

function getstyle(obj, key) {

if (obj.currentStyle) {

return  obj.currentStyle.key;

} else {

Return  getComputedStyle(obj, mull).key;

}

}

封装进getstyle函数

js获得当前元素的样式的更多相关文章

  1. js兼容获取元素的样式

    js获取元素的样式的兼容性处理: function getStyle(obj,attr){ return obj.currentStyle?obj.currentStyle[attr]:getComp ...

  2. 用JS改变的元素CSS样式,css里display :none 隐藏 block 显示

    CSS样式的引用有3种方式:style引用.class引用.id引用,所以js改变元素的样式我们也分3种来说. 1.js改变由style方式引用的样式:方法一:document.divs.style. ...

  3. (知识点)JS中获取元素的样式

    首先我们已经知道了JavaScript如果获取一个元素的内部样式,你可以这样做: <div id="box" style="width:100px;height:1 ...

  4. js中获取元素的样式兼容性的写法

    1:设计元素的样式:el.style.color="red"||el.style["color"]="red"  获取元素的样式:el.st ...

  5. 通过JS动态的修改HTML元素的样式和增添标签元素等

    一. 通过JS动态的修改HTML元素的样式   1. 要想在js中动态的修改HTML元素的样式,首先需要写document,    document我们称之为文档对象,这个对象中保存了当前网页中所有的 ...

  6. 原生js获取元素的样式信息

    工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...

  7. JS 之设置元素样式的改变,可以利用样式框架

    如果已经将某个元素的样式设定好了,又想改变,可以利用样式框架: function setStyle(obj,attr,value){ obj.style[attr]=value;//注意此处attr的 ...

  8. 通过js读取元素的样式

    /* * 通过元素.style.样式只能获取到内联样式的值,就是style写在元素里面的值,不能获取嵌入式和外联样式的值 * 所以如果要获取除内联样式后的值,就不能通过这个获取 * alert(box ...

  9. js获取隐藏元素宽高的方法

    网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...

随机推荐

  1. webpack4打包报错:WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults fo

    运行命令webpack ./src/main.js ./dist/murenziwei.js后,目录上神马动静都没有,你以为在dist文件夹上会有murenziwei.js吗?毛都没有 警告和错误倒是 ...

  2. angularjs学习第七天笔记(系统指令学习)

    您好,接着在昨天对简单指令学习了解以后,今天开始学习了解angularjs中的系统指令 系统指令大部分都是以ng开始,这也是为什么在自定义指令命名时不要以ng开始的原因所在 系统指令在学习了分成两个部 ...

  3. Spring Boot Oauth2缓存UserDetails到Ehcache

    在Spring中有一个类CachingUserDetailsService实现了UserDetailsService接口,该类使用静态代理模式为UserDetailsService提供缓存功能.该类源 ...

  4. loadsh常用函数

    此篇文章会记录常用的lodash函数 防抖函数:_.debounce() 创建一个去缓冲函数,该函数将自上次调用函数以来经过设置的等待毫秒后调用func. 去缓冲函数带有一个取消方法来取消延迟的fun ...

  5. 【代码笔记】Web-JavaScript-JavaScript语句

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  6. 【工具相关】Web-HTML特殊字符对照表

    特殊符号 命名实体 十进制编码 特殊符号 命名实体 十进制编码 特殊符号 命名实体 十进制编码 Α Α Α Β Β Β Γ Γ Γ Δ Δ Δ Ε Ε Ε Ζ Ζ Ζ Η Η Η Θ Θ Θ Ι Ι ...

  7. 【工具相关】Web-Sublime Text2新建立文件夹(二)

    紧接着上文. 一,打开Sublime Text2. 二,在桌面上新建立一个文件夹,html5. 三,打开html5如图所示.里面有我们刚刚建立好的文件. 四,把html5文件夹拖动到sublime2中 ...

  8. vue和webpack打包 项目相对路径修改

    一般vue使用webpack打包是整个工程的根目录,但是很多情况下都是把vue打包后的文件在某子目录下. 修改: 1,打开index.js assetsPublicPath:'/' 改为: asset ...

  9. 喜闻乐见-Android简介

    本文主要是对Android系统做一个简介,包括其架构.启动流程.沙箱机制.APK.Darlvik以及ART. 1. 架构 Android是基于Linux内核开发出的一个移动操作系统,系统结构大致可以分 ...

  10. Python:GUI之tkinter学习笔记3事件绑定

    相关内容: command bind protocol 首发时间:2018-03-04 19:26 command: command是控件中的一个参数,如果使得command=函数,那么点击控件的时候 ...