获取元素计算后的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. Java 中文乱码问题总结

    开发java应用出现乱码是很常见的,毕竟现在unicode的使用还不是很广泛,在使用gb2312(包含了gbk简体,big5繁体)的系统中要正确 实现中文的display和数据库的存储是最基本的要求. ...

  2. jaee开发起步：tomcat服务器的配置

    1.将下载下来的apache-tomcat-6.0.13.zip解压到任意文件夹. (打开tomcat官网,选择下载tomcat6.x.zip版本的tomcat不需要安装,直接解压并配置一下环境变量就 ...

  3. STM32f10xxx 之 GPIO口配置

    背景 配置stm32f103使其完成PWM输出的过程中,在配置GPIO口的时候,按照习惯配置GPIO口的speed为50MHZ,突然就意识到,为什么大部分例程习惯配置为50MHZ,而不是其它值,即有了 ...

  4. 排序算法总结------选择排序 ---javascript描述

    每当面试时避不可少谈论的话题是排序算法,上次面试时被问到写排序算法,然后脑袋一懵不会写,狠狠的被面试官鄙视了一番,问我是不是第一次参加面试,怎么可以连排序算法都不会呢?不过当时确实是第一次去面试,以此 ...

  5. noi前机房日常

    2015/6/16 上午a了一道省选分组赛day1t2,并在cf100553H双倍经验,好评 bzoj3152(ctsc2013)贪心,用priority_queue要清空 bx2k上午交了几十题,他 ...

  6. iOS6_自动约束 Constraints

    取消Constraints(约束) 问题描述:xib文件设计的时候控件已经摆好位置,但是每次调试的时候控件的位置又乱了 解决方法:选中 xib文件,在右侧第一项(Identity and type)的 ...

  7. js加载完所有的图片,适合电子相册哦~~~~

    有些时候要一口气加载完所有的图片,所以代码就要这么写.... var imgArray = [ 'http://s16.mogucdn.com/p1/160202/upload_ifqwcmlcmyy ...

  8. markdown简介

    欢迎使用Markdown编辑器写博客 本Markdown编辑器使用StackEdit修改而来,用它写博客,将会带来全新的体验哦: Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接 ...

  9. php二进制安全的含义

    PHP里,有string的概念.string里,每个字符的大小为byte(与PHP相比,Java的每个字符为Character,是UTF8字符,C语言的每个字符可以在编译时选择). byte里,有AS ...

  10. foxmail邮箱，签名中如何添加当前日期

    菜单--工具--模板管理 当前HTML模板中光标定位在签名之前,然后进行操作:插入宏--当前日期,适当调整位置即可 最下方为新邮件选择HTML模板 新建一封邮件试试吧