场景

你要获取某一元素的样式，可是没有获取到，返回的值为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. redis的hash, list, set类型相关命令

    hash相关命令: 1. hset HSET key field value 将哈希表key中的域field的值设为value.如果key不存在,一个新的哈希表被创建并进行hset操作.如果域fiel ...

  2. [转]JQuery判断浏览器类型版本1.9和2.0之后的区别

    转至:http://zhidao.baidu.com/link?url=Nzk2aSxBKRZKYg9Evqn8hLwMyXTI-4jza-zCAZq4Vd6hWCOHIvuBX6yj8hzDYDrf ...

  3. WEB API 用MemoryStream流做下载功能

    刚开始把MemoryStream 放在 var streamResult = new MemoryStream(); HttpResponseMessage response = new HttpRe ...

  4. cocos2d-x触屏事件（单点触屏）

    转自:http://blog.csdn.net/onerain88/article/details/7550009 一般经常用到的触屏的情况有两种:一种是Layer统一接收触屏消息,然后由程序根据需要 ...

  5. Swift利用闭包（closure）来实现传值--&gt;前后两个控制器的反向传值

    利用了大约一个多小时来搞明确OC中Blocks反向传值和Swift中Closure反向传值的区别,以下直接贴上代码: 一.第一个界面 // Created by 秦志伟 on 14-6-13. imp ...

  6. tar命令的详解

    tar命令 [root@linux ~]# tar [-cxtzjvfpPN] 文件与文件夹 ....參数:-c :建立一个压缩文件的參数指令(create 的意思):-x :解开一个压缩文件的參数指 ...

  7. 安装SQL Server提示“重叠的IO操作正在进行”解决

    单位新做了一个虚机.打算部署一套.Net SQL 的系统 系统是Server 2008 R2,机器除了系统,其它软件都没有. 所以须要安装SQL Server啊,.Net环境啊.配置IIS== 恰巧的 ...

  8. .PIG File

    .PIG File File extension: PIG File type: Texture File The PIG file type is primarily associated with ...

  9. C#隐式类型

    隐式类型 using System; using System.Collections.Generic; using System.Linq; using System.Text; using Sys ...

  10. IP地址基础知识

    IP地址基础知识 网络号:用于识别主机所在的网络:主机号:用于识别该网络中的主机. 一 OSI/RM模型 应用层 表示层 会话层 传输层 网络层 数据链路层 物理层 二 TCP/IP模型 数据链路层( ...