场景

你要获取某一元素的样式,可是没有获取到,返回的值为undefined,可是有时候又能成功?

为什么?

因为,xx.stly.xxx 可以获取的样式信息,是dom元素style属性里的样式,对于通过<style>标签,或外部样式表定义的,我们就无法获取了。当然,js给予的也是dom。

怎么办?

dom标准里有个全局方法  getComputedStyle 。可以获取到当前对象样式规则信息,这还不算完,因为IE不支持。。。

IE有自己的 currentStyle 所以,你要兼容他们,怎么做?

代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body,html{
height: 100%;
}
body{
background-color:red;
background-image:url(实验.png)
}
</style>
</head>
<body>
<div id="div1" style=''></div>
</body>
<script type="text/javascript">
window.onload = function(){
function t (obj,sx) {
if(obj.currentStyle){
return obj.currentStyle[sx];
}else{
return getComputedStyle(obj,false)[sx];
}
}
var body =document.getElementsByTagName('body');
body[0].style.backgroundImage ="url(实验.png)";
alert(t(body[0],"backgroundColor"));
}
</script>
</html>

大家可以试试。

获取元素样式 currentStyle 和 getcomputedStyle的更多相关文章

  1. 函数return/获取元素样式/封装自己的库

    一:函数return <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type&qu ...

  2. JavaScript获取元素样式

    原生的JavaScript获取写在标签内部的样式很简单: <div class="test" id="test" style="width:10 ...

  3. javascript 获取元素样式的方法

    javascript 获取元素样式常用方法. Javascript获取CSS属性值方法:getComputedStyle和currentStyle  1 .对于元素的内联CSS样式(<div s ...

  4. 原生js获取元素样式

    摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...

  5. 转贴:获取元素CSS值之getComputedStyle方法熟悉

    获取元素CSS值之getComputedStyle方法熟悉 一.碎碎念~前言 我们都用过jQuery的CSS()方法,其底层运作就应用了getComputedStyle以及getPropertyVal ...

  6. Vue 获取元素样式 元素高度

    看到这个问题我第一时间想的竟然是JS 不知道你是怎么想的 不过昨天有一个小哥哥 问我一个Vue的 哈哈哈 get了 我当时问他为什么不用JS获取 他说 这个性能更高 那我们来看看这个高性能的获取元素高 ...

  7. Js获取元素样式值(getComputedStyle&currentStyle)兼容性解决方案

    因为:style(document.getElementById(id).style.XXX)只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. 一般js获取内部样式和外部样式使用 ...

  8. js学习笔记7----return,arguments及获取元素样式

    1.return:返回值 1)函数名+括号:fn() ===> return; 2) 所有函数默认返回值:undefind; 3) return后面所有的代码都不会执行; 2.arguments ...

  9. 获取元素CSS值之getComputedStyle方法熟悉

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=2378 一.碎碎念~前 ...

随机推荐

  1. POJ1947 - Rebuilding Roads(树形DP)

    题目大意 给定一棵n个结点的树,问最少需要删除多少条边使得某棵子树的结点个数为p 题解 很经典的树形DP~~~直接上方程吧 dp[u][j]=min(dp[u][j],dp[u][j-k]+dp[v] ...

  2. UVa1449 - Dominating Patterns(AC自动机)

    题目大意 给定n个由小写字母组成的字符串和一个文本串T,你的任务是找出那些字符串在文本中出现的次数最多 题解 一个文本串,多个模式串,这刚好是AC自动机处理的问题 代码: #include <i ...

  3. pptp vpn

    webalizer是一个高效的.免费的web服务器日志分析程序.其分析结果以HTML文件格式保存,从而可以很方便的通过web服务器进行浏览; http://daliang1215.iteye.com/ ...

  4. 教程-delphi的开源json库:superobject,用法简介

    困惑一天的问题 一个语句搞定了... 回头细说. superobject中的{$DEFINE UNICODE} 就是它,这是json官方推荐的Delphi处理json的包,地址: http://www ...

  5. SSIS执行SQL任务时加入参数

    昨天开发的SSIS包中,获取ERP系统parttran表时,数据量比较大,达到255万多,因为SQL执行的关系,致使处理时效率很慢,所以就想用增量更新的方法处理该表数据.这是增量更新的SQL任务集合, ...

  6. zookeeper-3.4.8 集群搭建

    一.虚拟机环境 见我的另一篇博客http://www.cnblogs.com/xckk/p/6000881.html, zookeeper是用JAVA编写,因此需要安装JDK环境,centos下安装J ...

  7. 征服 Redis + Jedis + Spring (一)—— 配置&常规操作(GET SET DEL)

    有日子没写博客了,真的是忙得要疯掉. 完成项目基础架构搭建工作,解决了核心技术问题,接着需要快速的调研下基于Spring框架下的Redis操作. 相关链接: 征服 Redis 征服 Redis + J ...

  8. careercup-树与图 4.4

    4.4 给定一棵二叉树,设计一个算法,创建含有某一深度上所有结点的链表(比如,若一棵树的深度为D,则会创建D个链表). 类似于leetcode:Populating Next Right Pointe ...

  9. Android SmsManager 发送短信

    SmsManager可以在后台发送短信,无需用户操作,开发者就用这个SmsManager功能在后台偷偷给SP发短信,导致用户话费被扣.必须添加android.permission.SEND_SMS权限 ...

  10. 如何实现windows和linux之间的文件传输

    2010-04-25 18:10 如何实现windows和linux之间的文件传输 如果想从windows中传送大量文件到Linux中,想必会难倒部分Linux初学者,尤其是文件很大时.我曾试过在li ...