<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>计算元素样式</title>
<style type="text/css">
#myDiv
{
background-color: blue;
width: 100px;
height: 200px;
}
</style>
</head>
<body>
<div id="myDiv" style="background-color: red; border: 1px solid black">
</div> <script type="text/javascript"> var myDiv = document.getElementById("myDiv");
alert(getStyle(myDiv,"backgroundColor"));//"red" 或 rgb(255,0,0)
alert(getStyle(myDiv,"width")); //"100px"
alert(getStyle(myDiv,"height")); //"200px"
alert(getStyle(myDiv,"border")); //在某些浏览器中是“1px solid black”
//var computedStyle = document.defaultView.getComputedStyle(myDiv, null);
//alert(computedStyle.backgroundColor); //"red"
//alert(computedStyle.width); //"100px"
//alert(computedStyle.height); //"200px"
//alert(computedStyle.border); //在某些浏览器中是“1px solid black” //获取DOM的style属性
function getStyle(obj,attr)
{
if(obj.currentStyle) //用于IE
{
return obj.currentStyle[attr];
}
else
{
// document.defaultView.getComputedStyle 该方法时DOM2中才出现的方法
return document.defaultView.getComputedStyle(myDiv, null)[attr];
//getComputedStyle DOM1中的方法
//return getComputedStyle(obj,false)[attr];
}
} </script> </body>
</html>

js 获取DOM的style属性的更多相关文章

  1. js获取dom对象style样式的值

    js获取到的dom对象的style通常是没有值得,因为我们都写在外部文件中,从慕课网上见到讲师封装的一个方法,挺不错.特此记录下来. function getStyle(obj,attr){ if(o ...

  2. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  3. JS获取DOM元素的八种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  4. js 获取和设置css3 属性值的实现方法

    众多周知 CSS3 增加了很多属性,在读写的时候就没有原先那么方便了. 如:<div style="left:100px"></div> 只考虑行间样式的话 ...

  5. 原生JS获取DOM 节点到浏览器顶部的距离或者左侧的距离

    关于js获取dom 节点到浏览器顶/左部的距离,Jquery里面有封装好的offset().top/offset().left,只到父级的顶/左部距离position().top/position() ...

  6. 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题

    1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...

  7. vue 获取dom的css属性值

    <template> <div id="topInfo" ref="topInfo" style="width: 200px;hei ...

  8. js获取一个对象的所以属性和值

    在HTML DOM中,获取某个元素对象的时候,往往记不住它的很多属性,可以通过下面的例子来查找一下: <!DOCTYPE html> <html> <body> & ...

  9. js 获取html5的data属性

    我以前一直以为只能用jquery的data()来获取 哈哈 是我太弱了 <!DOCTYPE html> <html> <head> <title>dat ...

随机推荐

  1. python自动化运维笔记2 —— IP地址处理模块IPy

    1.2 实用的IP地址处理模块IPy ip地址规划是网络设计中非常重要的一个环节,规划的好坏会直接影响路由协议算法的效率,包括网络性能.可扩展性等方面,在这个过程当中,免不了要计算大量的IP地址,包括 ...

  2. js實現

    js的代碼寫在<script></script>中: <script></script>可以放在body中或者head中,如果放在body中,一般放在b ...

  3. 深度学习网络压缩模型方法总结(model compression)

    两派 1. 新的卷机计算方法 这种是直接提出新的卷机计算方式,从而减少参数,达到压缩模型的效果,例如SqueezedNet,mobileNet SqueezeNet: AlexNet-level ac ...

  4. 微软开放 6 万项 Linux 专利,有哪些是我们该注意的?

    导读 上周,微软宣布正式加入 Open Invention Network (“OIN”) 社区,开放其 6 万多项 Linux 专利.消息一出,许多人疑惑微软为什么要这么做?作为普通开发者,是否能使 ...

  5. python面对对象编程中会用到的装饰器

    1.property 用途:用来将对像的某个方法伪装成属性来提高代码的统一性. class Goods: #商品类 discount = 0.8 #商品折扣 def __init__(self,nam ...

  6. Spark_RDD之RDD基础

    1.什么是RDD RDD(resilient distributed dataset)弹性分布式数据集,每一个RDD都被分为多个分区,分布在集群的不同节点上. 2.RDD的操作 Spark对于数据的操 ...

  7. jenkins--svn+添加钩子去触发jenkins的job工作

    找到svn钩子脚本 post-commit: 添加一个接口: /usr/bin/curl http://admin:admin@x.x.x.x:8080/job/svn/buildWithParame ...

  8. Luogu4512 【模板】多项式除法(多项式求逆+NTT)

    http://blog.miskcoo.com/2015/05/polynomial-division 好神啊! 通过翻转多项式消除余数的影响,主要原理是商只与次数不小于m的项有关. #include ...

  9. MT【66]寻找对称中心

    设函数$f(x)=2x-cosx,{a_n}$是公差为$\frac{\pi}{8}$的等差数列,$f(a_1)+f(a_2)+f(a_3)+f(a_4)+f(a_5)=5\pi$,则 $[f(a_3) ...

  10. MT【17】利用柯西不等式求三角的最大值

    评:此题也可以设$1+cos\theta=t$,平方后变成$t$的单变量利用均值去做. 柯西平衡系数法其实就是待定系数法,利用等号取到的条件.