js计算机样式window.getComputedStyle(ele,null)2
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>window.getComputedStyle(div,null)</title>
<style type="text/css">
*{margin:0;padding:0}
</style>
</head>
<body>
<div style="width: 100px; height: 100px; background: red; position: absolute;left: 0; top:0"></div>
<script type="text/javascript">
//封装
function getStyle(elem,prop){
if(window.getComputedStyle){ //如果它存在的话(兼容谷歌)
return window.getComputedStyle(elem,null)[prop];//prop作为参数字符串传进来，所有得中括号
}else{
return elem.currentStyle[prop]; //兼容IE
}
}
var timer;
var div = document.getElementsByTagName('div')[0]
timer=setInterval(function(){
div.style.left=parseInt(getStyle(div,'left'))+1+"px";//注意：getStyle(div,'left')打印出来是0px,所以用parseInt取整数
},10)
div.onclick = function() {
clearInterval(timer)
}
</script>
</body>
</html>
效果图：
js计算机样式window.getComputedStyle(ele,null)2的更多相关文章
- js计算机样式window.getComputedStyle(ele,null)与
一.getComputedStyle兼容IE8以上,范户籍的计算样式的值都是绝对值,没有相对单位(如:width:10em; 它打印出来是160px) window.getComputedStyle( ...
- 关于obj.currentStyle.property、window.getComputedStyle(obj,null).property、obj.style.property的理解
首先是obj,style.property 我一直用这个obj.style.property这个属性来修改内联和外联的obj属性,但是从网上看到了obj.style.property居然只能读取内嵌的 ...
- 兼容获取元素当前样式 currentStyle || getComputedStyle
function getStyle(ele, attr) { return ele.currentStyle ? ele.currentStyle[attr] : window.getComputed ...
- 原生js获取样式
js中的获取样式是在是让人头疼,为了方便兼容多个浏览器,把设置样式封装成一个函数. 函数如下: function getStyle(element, property) { var value = e ...
- window,getComputedStyle，letter-spacing
js 拿到element的css样式 window.getComputedStyle(ele,[pseuso) 比如想拿到一个element的背景色 window.getComput ...
- window.getComputedStyle()方法的使用及其扩展
1.window.getComputedStyle()方法返回值 是一个可以获取当前元素所有最终使用的CSS属性值.返回的是一个CSS样式声明对象([object CSSStyleDeclaratio ...
- JS获取样式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS 操作样式 style
1. 任何支持 style 特性的 HTML 元素在 JavaScript 中都对应着有一个 style 属性,指向一个 CSSStyleDeclaration 的一个实例对象,包含该元素的内嵌sty ...
- 总结js(Iframe、window.open、window.showModalDialog)父窗口与子窗口之间的操作
http://hi.baidu.com/yashua839/blog/item/131fdb2fe547ef221f3089af.html一.Iframe 篇 //&&&&am ...
随机推荐
- 文件 md5 查看 命令
Windows命令查看文件MD5 certutil -hashfile yourfilename.ext MD5 certutil -hashfile yourfilename.ext SHA1 ...
- curl 访问 k8s
curl https://mhc:6443/api --cacert ssl/ca.crt --key client_ssl/cs_client.key --cert client_ssl/cs_cl ...
- 【Unity】关于U3d与bip骨骼适配
http://blog.csdn.net/kiki110120/article/details/50371662 写在2015/12/21 1.Generic 在拿到美术FBX文件后,导入u3d,默认 ...
- Comet OJ - Contest #2 D 枚举重心
题面 思路: 函数f相当于是求一个点集f的直径,有一个性质是如果这个点集有多个直径一定相交于某一个点,或者一条边的中心,所以我们暴力枚举重心,计算以某个点为重心的点集对答案的贡献. 具体实现的时候,我 ...
- c++ 中介者模式（mediator）
中介者模式:用一个中介对象来封装一系列的对象交互.中介者使各个对象不需要显示地相互引用,从而使其耦合松散,而且可以独立地改变他们之间的交互.中介者模式的例子很多,大到联合国安理会,小到房屋中介.下面以 ...
- SpringBoot01 InteliJ IDEA安装、Maven配置、创建SpringBoot项目、yml属性配置、多环境配置、自定义properties配置
1 IntelliJ IDEA 安装 下载地址:点击前往 注意:需要下载专业版本的,注册码在网上随便搜一个就行啦 2 MAVEN工具的安装 2.1 获取安装包 下载地址:点击前往 2.2 安装过程 到 ...
- DALSA相机SDK不完全教程
1.SDK介绍 Dalsa是全球顶尖的CCD/CMOS芯片和相机制造商,总部位于加拿大,我使用的是 Dalsa的 Genie_TS_M1920(黑白)和 Genie_TS_C2048(彩色)两款工业相 ...
- windows下怎么安装protobuf for python
首先从google上下载protobuf-3.0.0.zip和protoc-3.0.0-win32.zip,然后把protoc-3.0.0-win32.zip里的protoc.exe放到protobu ...
- 设计模式--单例模式（Singleton）详解
单例对象(Singleton)是一种常用的设计模式.在Java应用中,单例对象能保证在一个JVM中,该对象只有一个实例存在.这样的模式有几个好处: 1.某些类创建比较频繁,对于一些大型的对象,这是一笔 ...
- [c++] polymorphism without virtual function
polymorphism without virtual function