获取元素计算后的css样式封装
获取元素计算后的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样式封装的更多相关文章
- 前端笔记之JavaScript（八）关于元素&计算后的样式
一.获取元素方法(JS选择器) 1.1概述 得到id元素的方法 document.getElementById() 得到一个元素.事实上,还有一个方法可以得到标签元素,并且得到的是多个元素: docu ...
- 获取元素计算样式getComputedStyle（）与currentStyle
window.getComputedStyle()方法是标准化接口,返回一个对象,该对象在应用活动样式表并解析这些值可能包含的任何基本计算后报告元素的所有CSS属性的值. 私有的CSS属性值可以通过对 ...
- JS获取元素计算过后的样式
获取元素计算过后的样式 Window.getComputedStyle() 方法会在一个元素应用完有效样式且计算完所有属性的基本值之后给出所有 CSS 属性的值. 语法: let style = wi ...
- JS---获取元素计算后的样式属性值 (getComputedStyle)---兼容函数
获取计算后的样式属性----获取一个元素任意一个样式属性值 获取元素距离左边位置的值 会有如下兼容性问题: my$("btn").onclick = function () { / ...
- 关于获取、设置css样式封装的函数入门版
<html> <head> <meta charset="UTF-8"> <title>CSS样式的获取和设置:简单版</ti ...
- JQuery获取元素宽度.width()与.css(‘width’)两个函数的区别
整理翻译自:http://blog.jquery.com/2012/08/16/jquery-1-8-box-sizing-width-csswidth-and-outerwidth/ 大意是: 在J ...
- html5shiv主要解决IE6-8 无法识别HTML5的新标签，父节点不能包裹子元素，以及应用CSS样式
html5shivehtml5shiv主要IE6-8解决:1,HTML5提出的新的元素不被IE6-8识别.2,这些新元素不能作为父节点包裹子元素,3,并且不能应用CSS样式.让CSS 样式应用在未知元 ...
- js获取css样式封装
封装 function getStyle(obj , attr){ return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(ob ...
- vue项目中打包编译后，CSS样式【-webkit-box-orient: vertical】打包后丢失问题
最近在做vue项目的时候页面处理多行文本样式时用到了-webkit-box-orient: vertical这个属性,本地跑项目没问题,但是打包放到服务器后发现这个属性丢失了.如下图: 后来在网上查了 ...
随机推荐
- Java动态加载JAR包
参考代码: package org; import java.io.File; import java.net.URL; import java.net.URLClassLoader; import ...
- Linux PXE无盘工作站
• 关于PXE无盘工作站系统的简介 PXE无盘工作站系统是指由一台或多台“系统服务器”和多台“PXE客户端(无盘工作站)”通过 交换机 相连组成的局域网系统. (图1:无盘工作站系统部署拓扑图) • ...
- Linux搭建Nginx
1.Nginx安装 1.1 pcre (1)下载编译包 http://www.pcre.org/ (注意需要的是pcce,而非pcre2) (2)tar -zxvf pcre-8.36.tar.gz ...
- mysql 中基础英语单词 （一）关于数据库创建与查找 （包括简写单词）
create 创建 limit 限制 count 计算 rollup 几上归纳 drop 降下,撤销 ...
- iOS小Tip之查看FPS
可能大家有的时候会想要查看app在运行时的帧率能否达到60帧,如果达不到的话,你可能会想着去优化动画或者其它任何会影响显示性能的问题. 但是,你首先要观察到你的FPS,对吧? 我告诉大家一个简单的方法 ...
- java从基础知识（十）java多线程（上）
线程,有时被称为轻量级进程(Lightweight Process,LWP),是程序执行流的最小单元.另外,线程是进程中的一个实体,是被系统独立调度和分派的基本单位,线程自己不拥有系统资源,只拥有一点 ...
- AngularJs:Service、Factory、Provider依赖注入使用与区别
本教程使用AngularJS版本:1.5.3 AngularJs GitHub: https://github.com/angular/angular.js/ ...
- 1. K线基础知识一
1. 什么是K线: K线起源于日本米市交易,它的基本用途就是为了寻找"买卖点". 2. K线按照计算周期可分为日K线,周K线,月K线,年K线. 周K线:周一的开盘价,周五的收盘价, ...
- Qt - 错误总结 - 在自定义类头文件中添加Q_OBJECT 编译时报错（undefined reference to ‘vtable for xxThread）
错误提示:在添加的QThread子类头文件添加Q_OBJECT时,编译程序,出现"undefined reference to 'vtable for xxThread'"错误提示 ...
- git知识点整理