如何在IE9剥离样式属性值之前获取它

Question

在IE9-10删除无效值之前，我试图获取样式属性的值。到目前为止，我已经尝试了以下每一种变体-

$0.attributes.style $0.style $0.getAttribute('style')

但是如果我试图设置一个无效的值，我就无法访问它-

<div style="display: none; color: ${fake-value}">

</div>

所有这些都只返回display: none，因为IE9-10去掉了无效的值。

作为一个注释，我已经尝试了大量的变体，所以如果不可能，那很好，但是你试过或者你能尝试答案，除非它们被确认可以做些什么，否则不要有太大的帮助:)

Answer 1

不幸的是，由于IE9实现CSS对象模型规范的方式，这是不可能的。

如果我们看一下规范，我们可以假设发生了以下情况(强调我的)：

6.7.1解析CSS值 要解析给定属性的CSS值，意味着遵循以下步骤：

• 让list是通过从value调用一个组件值列表来返回的值。
• 匹配列表与CSS规范中属性的语法匹配。
• 如果上述步骤失败，则返回null.
• 退货单。

由于您的自定义颜色值与颜色属性的语法不匹配，所以IE在DOM中显示之前返回null，实质上忽略解析中的属性。

虽然您已经提到您不想使用数据属性，但我再次建议您使用数据属性，这将为您提供跨平台的解决方案：

<div style="display: none;" data-color="${fake-value}">

如果您真的不能使用数据属性，另一种选择是以编程方式查看页面的源，并将其解析为指定的值。我不建议这样做，但是如果这是您想探索的一个途径，您可以找到一个相关的问题这里。

更新

有趣的是，如果我们查看CSS样式声明的DOM规范，我们会发现：

虽然实现可能不识别CSS声明块中的所有CSS属性，但它将通过CSSStyleDeclaration接口提供对样式表中所有指定属性的访问。

因此，作为对我上一个答案的更新，我推测IE9错误地解释了规范--在DOM解析期间使用CSSOM return null实现(或类似于它)，而不是预期的DOM实现。

这就解释了为什么在其他浏览器中会得到预期的结果。

Answer 2

不能在元素上使用自定义属性来保存“无效”数据吗？就像<element data-custom-attribute="some invalid stuff"></element>。

然后可能使用Javascript，您可以使用它并将其添加到样式中。

Answer 3

嗯.我想你应该用ng风格来做那个元素。Ng风格将被不同的评估，并将填补元素的风格与适当的价值之后。通常，您会将agular求值元素放在它们相应的角度指令中。在你的情况下，那是纳克风格的。

例如，<element style="properStyle" ng-style="scopeVariableContainingMoreStyle"></element>将添加适当的样式，然后添加评估的样式。