javascript - getComputedStyle 对象包含方法？

Question

我在这里设置了一个演示: http://jsbin.com/evifeb/

这更像是我在大声思考，而不是一个适当的问题，但是..

为什么浏览器将样式规则与辅助方法和保留字一起直接插入到计算样式对象中？它只会让解析变得困难。例如，您可能会注意到在我的演示中我过滤掉了除字符串和数字之外的所有内容。这是为了清除同一范围内的函数。虽然这不是 100% 准确，因为 length 属性值是一个数字。为什么不使用像“getAllStyles”这样的原型(prototype)函数来返回样式对象而不是废话呢？

好吧，所以我知道“getPropertyValue”，但只有当你想要一个指定的样式规则时它才有用。所以我想我想说的是:A)是否有返回这样一个对象的正确方法那是跨浏览器安全的吗？和 B) 如果不是，除了长度之外是否还有其他属性(不在 css 规范中)需要剔除？

非常感谢您的帮助。我准备拔牙了。

Answer 1

听起来您的 for 循环需要适量的 Object.hasOwnProperty .

使用 hasOwnProperty() 过滤器将大体上解决问题，但它治标不治本。 原因 是您的代码使用了 for...in 循环来遍历数组。 Don't do this.

使用for...in 遍历对象，使用for 遍历数组。

---

最后一件事:getComputedStyle() 返回 CSSStyleDeclaration 的(只读)实例.使用提供的 API，事情很简单:

for (var i=0; i<computedStyles.length; i++)
{        
    cssProperty = computedStyles[i];
    cssValue = computedStyles.getPropertyValue(cssProperty);
    // snip...
}

演示:http://jsbin.com/owenij/2