通过getComputedStyle（）获取边界值。getPropertyValue（）？ （Mozilla，FF） [英] Get border value with getComputedStyle().getPropertyValue()? (Mozilla, FF)

问题描述

在某些浏览器（即Firefox）中， getComputedStyle（）。getPropertyValue（）不会报告任何简写CSS，如 border 。有没有获得这些简短的CSS值非特定代码的方式？我已经考虑制作一个简写CSS的白名单和他们各自的CSS手势。但我意识到这样做会是一个巨大的痛苦和一个非向前兼容的设计。

我想知道，你想用字符串来做什么，比如 border：1px solid＃000 ？

假设您要复制一个元素 border 以复制元素 copyStyle（el2 ，el，border）：

  //将一组元素的样式另一个。 
函数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]; 
 
 
 
 $ b // prototype.js 
函数camelize（text）{
 return text.replace（/  -  + （。）？/ g，function（match，chr）{
 return chr？chr.toUpperCase（）：''; 
}）; 
 
 
 
 
 
 $ b 
比较两个元素的给定样式集合是否可以以相同的方式进行比较。除此之外，我真的不能看到使用一个字符串，如果你想用它计算任何东西，应该解析它。
 
In some browsers (namely, Firefox) the getComputedStyle().getPropertyValue() doesn't report anything for shorthand CSS, like border. Is there a non-specific-code way of getting these shorthand CSS values? I've considered making a whitelist of shorthand CSS and their respective longhand CSS values. But I realize doing that would be both a big pain and a non-forward-compatible design.
解决方案
I'm wondering, what do you want to do with a string like border: 1px solid #000? 

Say you want to reproduce an elems border in order to copy it 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() : '';
  });
}
Comparing if two element's given set of styles matches can be done in the same manner. Other than that, I really can't see the use a string, which should be parsed if you want to compute anything with it.

                        
这篇关于通过getComputedStyle（）获取边界值。getPropertyValue（）？ （Mozilla，FF）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！