使用getComputedStyle()获取边框值.getPropertyValue()? (Mozilla,FF)

时间:2010-11-19 22:39:41

标签: javascript css firefox shorthand

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

1 个答案:

答案 0 :(得分:2)

我想知道,你想用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() : '';
  });
}

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