如何获取当前元素的计算样式答案

【问题标题】：How to get the computed style of the current element如何获取当前元素的计算样式
【发布时间】：2013-12-05 08:44:27
【问题描述】：

我想用JS获取当前元素的计算样式，我能够获取其他属性，但在涉及 css 时被卡住了。

这是我的代码，请帮忙

 document.addEventListener("click", function (e) {
 e.preventDefault();
 var dom_id = e.target.id.toString();

 var dom_class = e.target.className.toString();
 var dom_el = e.target.toString();
 var dom_html = e.target.innerHTML;


  document.getElementById('ospy_id').value = dom_id;
  document.getElementById('ospy_class').value = dom_class;
  document.getElementById('ospy_el').value = dom_el;
           }, 
    false);

【问题讨论】：

你检查过这里developer.mozilla.org/en-US/docs/Web/API/…
@elclanrs 我正在开发一个 chrome 插件，它给出了当前元素的属性。
@CleanX：那你的问题不正确。您特别要求 computed 样式，但接受了一个答案，即只为您提供在元素上分配的样式，而不是来自样式表。

标签： javascript jquery css jquery-plugins google-chrome-extension

【解决方案1】：

使用以下语句获取任意元素的 css

document.getElementById(elementid).style.property

example:
document.getElementById("ospy_class").style.color

【讨论】：

【解决方案2】：

如果您使用的是 jquery（基于您的标签），您可以执行以下操作：

  $("#elementID").css("color");

等等……Documentation

【讨论】：

我正在获取目标元素的属性。所以我不会有这样的类 ID
您要获取哪个元素的 css ？ dom_id ？如果是这样，其他元素将是 $("#" + dom_id).css("color"); 等等

【解决方案3】：

它不是 jQuery，但在 Firefox、Opera 和 Safari 中，您可以使用 window.getComputedStyle(element) 来获取元素的计算样式，而在 IE 中，您可以使用 element.currentStyle 。返回的对象在每种情况下都是不同的，我不确定使用 Javascript 创建的元素和样式的效果如何，但也许它们会很有用。

请参考以下网址...

jQuery CSS plugin that returns computed style of element to pseudo clone that element?

【讨论】：

你可以在IE中使用getComputedStyle。