从元素中获取 CSS 值答案

【问题标题】：Getting CSS Values from elements从元素中获取 CSS 值
【发布时间】：2013-03-03 17:03:50
【问题描述】：

我需要使用 web storage api 来存储一个页面上元素的样式更改。我实际上不知道如何做到这一点，但我想我应该首先获取 已更改 的 CSS 属性并将其存储在一个数组中。我试图关注here 的进展，并根据我的问题对其进行定制。

这是我为获取值而尝试的方法，但我不确定它是否正确：

function newItem(){
    var bgImg = document.getElementsByTagName('body').bgImg[0].style.getPropertyValue('background');
    var wideScreen = getElementById('sidebar').style.getPropertyValue('display');
    var playerColor = getElementById('video_container').style.getPropertyValue('background-color');     
    }

我不确定我上面写的代码是否获取了我需要的信息。

【问题讨论】：

你为什么不确定？你没测试过吗？

标签： javascript css html local-storage web-storage

【解决方案1】：

您可以使用getComputedStyle().

getComputedStyle() 给出一个元素的所有 CSS 属性的最终使用值。

var element = document.getElementById('sidebar'),
    style = window.getComputedStyle(element),
    display = style.getPropertyValue('display');


var element = document.getElementById('video_container'),
    style = window.getComputedStyle(element),
    bg = style.getPropertyValue('background-color');

【讨论】：