获取元素计算后的css样式封装:

    function getCss(obj,attribute) {
if(obj.currentStyle) {
return obj.currentStyle[attribute];}else {
return window.getComputedStyle(obj,null)[attribute];}
}

案例:

<!DOCTYLE html>
<html>
<head>
<meta charset="uft-8" />
<style>
#box {width:100px; height: 100px; background:#dfd; position:absolute; left:100px; top:100px;}
</style>
</head>
<body>
<button id="btn1">200</button>
<button id="btn2">600</button>
<div id="box"></div>
</body>
</html>
<script>
function getCss(obj,attribute) {
if(obj.currentStyle) {
return obj.currentStyle[attribute];}else {
return window.getComputedStyle(obj,null)[attribute];}
}
console.log(getCss(box,'zIndex'));
</script>

获取元素计算后的css样式封装的更多相关文章

  1. 前端笔记之JavaScript(八)关于元素&计算后的样式

    一.获取元素方法(JS选择器) 1.1概述 得到id元素的方法 document.getElementById() 得到一个元素.事实上,还有一个方法可以得到标签元素,并且得到的是多个元素: docu ...

  2. 获取元素计算样式getComputedStyle()与currentStyle

    window.getComputedStyle()方法是标准化接口,返回一个对象,该对象在应用活动样式表并解析这些值可能包含的任何基本计算后报告元素的所有CSS属性的值. 私有的CSS属性值可以通过对 ...

  3. JS获取元素计算过后的样式

    获取元素计算过后的样式 Window.getComputedStyle() 方法会在一个元素应用完有效样式且计算完所有属性的基本值之后给出所有 CSS 属性的值. 语法: let style = wi ...

  4. JS---获取元素计算后的样式属性值 (getComputedStyle)---兼容函数

    获取计算后的样式属性----获取一个元素任意一个样式属性值 获取元素距离左边位置的值 会有如下兼容性问题: my$("btn").onclick = function () { / ...

  5. 关于获取、设置css样式封装的函数入门版

    <html> <head> <meta charset="UTF-8"> <title>CSS样式的获取和设置:简单版</ti ...

  6. JQuery获取元素宽度.width()与.css(‘width’)两个函数的区别

    整理翻译自:http://blog.jquery.com/2012/08/16/jquery-1-8-box-sizing-width-csswidth-and-outerwidth/ 大意是: 在J ...

  7. html5shiv主要解决IE6-8 无法识别HTML5的新标签,父节点不能包裹子元素,以及应用CSS样式

    html5shivehtml5shiv主要IE6-8解决:1,HTML5提出的新的元素不被IE6-8识别.2,这些新元素不能作为父节点包裹子元素,3,并且不能应用CSS样式.让CSS 样式应用在未知元 ...

  8. js获取css样式封装

    封装 function getStyle(obj , attr){ return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(ob ...

  9. vue项目中打包编译后,CSS样式【-webkit-box-orient: vertical】打包后丢失问题

    最近在做vue项目的时候页面处理多行文本样式时用到了-webkit-box-orient: vertical这个属性,本地跑项目没问题,但是打包放到服务器后发现这个属性丢失了.如下图: 后来在网上查了 ...

随机推荐

  1. spring MVC mybatis dispacherServlet(源码解读)

    以下源码版本(4.2.0.RELEASE) dispacherServlet是servlet的实现类,是spring MVC的前端转发器,是spring MVC的核心. 那么它做了哪些事呢? 它主要做 ...

  2. Oracle函数组的使用

    --1.组函数--COUNT():用来统计记录的条数 如果没有记录,返回 0--COUNT函数可以根据一列或多列进行计算,没有排重功能--统计EMP表一共有多少条记录select count(empn ...

  3. python模块(json和pickle模块)

    json和pickle模块,两个都是用于序列化的模块 • json模块,用于字符串与python数据类型之间的转换 • pickle模块,用于python特有类型与python数据类型之间的转换 两个 ...

  4. MySql简易配置

    选择standard configuration ,然后next Service Name :服务名字 Launch the MySQL Server automatically:是否开机启动mysq ...

  5. linux 命令 之判断表达式

    摘自http://www.comptechdoc.org/os/linux/usersguide/linux_ugshellpro.html Tests There is a function pro ...

  6. FFmpeg和X264的交叉编译环境

    在下载好了FFmpeg和X264的源码包之后,在Linux下进行安装的基本流程就是切换到其源码的根目录,然后以此执行以下命令.基本上所有的开源源码包的默认编译安装都是这三步. ./configure ...

  7. 通过挂载系统光盘搭建本地yum仓库的方法

    在CentOS系统中,我们常常会安装大量的软件,但许多软件包都存在需要依赖性,当然我们可以通过一一安装依赖包来完成安装,但对于有些软件包需要大量的依赖包,再一一安装起来会显得特别麻烦.接下来我们就来讲 ...

  8. windows内网渗透技巧

    1.(windows)无扫描器情况下内网存活主机探测: for /l %i in (1,1,255) do @ping 192.168.1.%i -w 1 -n 1 | find /i "t ...

  9. [原创]Windows Server 2003 物理机转换为VMware虚拟机出现VSS错误的处理

    一台Windows Server 2003 物理机需要转换为VMware虚拟机,工具为Vmware vCenter Converter Standalone 6.0,转换开始就出现错误“FAILED: ...

  10. 修改MySql 数据默认存储路径

    1. cmd进入控制台 net stop mysql 2.复制原来数据库目录到新目录 复制C:\ProgramData\MySQL\MySQL Server 5.5\中的data目录到 D:\Prog ...