使用 getComputedStyle().getPropertyValue() 获取边框值？（Mozilla，FF）答案

【问题标题】：Get border value with getComputedStyle().getPropertyValue()? (Mozilla, FF)使用 getComputedStyle().getPropertyValue() 获取边框值？（Mozilla，FF）
【发布时间】：2011-05-12 21:58:40
【问题描述】：

在某些浏览器（即 Firefox）中，getComputedStyle().getPropertyValue() 不会报告任何简写 CSS，例如 border。是否有获取这些速记 CSS 值的非特定代码方式？我考虑过制作速记 CSS 及其各自的速记 CSS 值的白名单。但我意识到这样做既是一个巨大的痛苦，也是一个不向前兼容的设计。

【问题讨论】：

标签： javascript css firefox shorthand

【解决方案1】：

我想知道，你想对像border: 1px solid #000 这样的字符串 做什么？

假设你想复制一个元素border 以便复制它copyStyle(el2, el, "border")：

// Copies a set of styles from one element to another.
function copyStyle(dest, source, shorthand) {
  var computed = window.getComputedStyle(source, null);
  for (var i = computed.length; i--;) {
    var property = camelize(computed[i]);
    if (property.indexOf(shorthand) > -1) {
      console.log(property)
      dest.style[property] = computed[property];
    }
  }
}

// prototype.js
function camelize(text) {
  return text.replace(/-+(.)?/g, function (match, chr) {
    return chr ? chr.toUpperCase() : '';
  });
}

比较两个元素的给定样式集是否匹配可以以相同的方式完成。除此之外，我真的看不到使用字符串，如果你想用它来计算任何东西，就应该解析它。

【讨论】：