style:获取行间样式;
currentStyle:获取计算后的样式,也叫当前样式、最终样式。

优点:可以获取元素的最终样式,包括浏览器的默认值,而不像style只能获取行间样式,所以更常用到。
注意:不能获取复合样式如background属性值,只能获取单一样式如background-color等。

alert (oAbc.currentStyle);
IE8和Opera 11弹出了“object CSSStyleDeclaration”;FF 12、chrome 14、safari 5则弹出“undefined”。

 

var oAbc = document.getElementById("abc");
if(oAbc.currentStyle) {
        //IE、Opera
        alert("我支持currentStyle");
} else {
        //FF、chrome、safari
        alert("我不支持currentStyle");
}

其实在FF浏览器中我们可以使用getComputedStyle(obj,false)来达到与IE下currentStyle相同的效果。

getComputedStyle(obj,false):在FF新版本中只需要第一个参数,即操作对象,第二个参数写“false”也是大家通用的写法,目的是为了兼容老版本的火狐浏览器。

兼容写法:

var oAbc = document.getElementById("abc");
if(oAbc.currentStyle) {
        //IE、Opera
        //alert("我支持currentStyle");
        alert(oAbc.currentStyle.width);
} else {
        //FF、chrome、safari
        //alert("我不支持currentStyle");
        alert(getComputedStyle(oAbc,false).width);
}

javascript获取行间样式和非行间样式--兼容写法的更多相关文章

  1. JavaScript 学习—— js获取行间样式和非行间样式

    1. 问题引入 <head> <style> #div1{ width:150px; height:200px; position:absolute; left:-150px; ...

  2. js用currentStyle和getComputedStyle获取css样式(非行间) 兼容ie与火狐

    用js的style属性可以获得html标签的样式,但是不能获取非行间样式.那么怎么用js获取css的非行间样式呢?在IE下可以用currentStyle,而在火狐下面我们需要用到getComputed ...

  3. JS获取非行间样式

    我们都知道用offset函数获取元素样式是一件很方便的事,但是offset只能获取行间样式,而无法获得非行间样式,这是它的瓶颈所在. 我们都知道js获取行间样式的方法,那么js是如何获取行距样式的呢? ...

  4. js和jquery中获取非行间样式

    样式又分为了行间样式和非行间样式.一般来说行间样式用的是比较少的,因为它能够作用的范围就只有一个元素,而非行间样式的作用范围可以是一类元素(即拥有相同德标签,或者说是有相同的类名,(当然id名不可能相 ...

  5. javascript中获取非行间样式的方法

    我们都知道一般在javascript中获取样式一般用的是nodeObj.style.attr这个属性的,但是这个属性只能获取行间样式非行间样式比如写在样式表中的样式那么用nodeObj.style.a ...

  6. JavaScript获取非行间样式/定义样式

    html节点的样式分为以下几种 (1)浏览器默认样式 (2)引用样式(引用外部css文件的样式.style标签内定义的样式) 引用外部css样式:<link rel="styleshe ...

  7. js获取非行间样式/写入样式(行间)

    <!--DOCTYPE html--> <html> <head> <meta charset="utf-8" /> <sty ...

  8. js获取非行间样式/定义样式

    <!--DOCTYPE html--> <html> <head> <meta charset="utf-8" /> <sty ...

  9. js获取非行间样式或定义样式

    <!--DOCTYPE html--> <html> <head> <meta charset="utf-8" /> <sty ...

随机推荐

  1. Vistual Studio的导出模板功能

    应用场景,每个项目有自己固定的目录结构和引用文件, 无需每次创建一个项目,就手工一一将那些目录再new一遍.如图所示 菜单  文件=>导出模板 之后的操作基本上一路"下一步" ...

  2. netty下载源码并导入idea

    netty源码导入eclipse会有一些兼容性问题,网上有解决方案,官方推荐idea,故此用idea. 拷贝git地址:https://github.com/netty/netty.git 使用git ...

  3. 改变HTML文件上传控件样式

    思路: 1.重写一个新的样式 2.将默认样式设置display:none;,即设为不可见 3.在js里调用:当点击新样式的时候,调用这个input的点击事件 html: <div class=& ...

  4. 关于nohup命令

    nohup java -jar Test.jar --server.port=443 > console.log 2>&1 & 关于nohup命令 when using t ...

  5. Git分支管理命令

    1. 创建新分支 1)创建新仓库 git init git add README.md git commit -m "readme.md" git remote add origi ...

  6. bzoj3684: 大朋友和多叉树(拉格朗日反演+多项式全家桶)

    题面 传送门 题解 首先你得知道什么是拉格朗日反演->这里 我们列出树的个数的生成函数 \[T(x)=x+\prod_{i\in D}T^i(x)\] \[T(x)-\prod_{i\in D} ...

  7. Vue知识分享一

    最近想着把之前学的Vue的知识整理一下,方便在公司和同事一起分享.我想要按照下面几个方面去说一下,我对vue的学习理解. 一.什么是VUE vue.js是一个用来开发Web界面的前端库,是很轻量级的工 ...

  8. Linux安装步骤

    1.查看Linux系统是32位还是64位 #查看系统位数 getconf LONG_BIT #或者 uname -m #或者 arch #或者 file /sbin/init 2.IP配置 网络选择桥 ...

  9. BFS【bzoj1667】: [Usaco2006 Oct]Cows on Skates滑旱冰的奶牛

    1667: [Usaco2006 Oct]Cows on Skates滑旱冰的奶牛 Description 经过跟Farmer John长达数年的谈判,奶牛们终于如愿以偿地得到了想要的旱冰鞋.农场上大 ...

  10. luogu2480 [SDOI2010]古代猪文

    link 题意一开始没TM读懂... 就是给定一个\(G\le10^{10},N\le10^9\),求\(G^{\sum_{d|n}{n\choose d}}\),对999911659取模 由于999 ...