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

Question

我试图在IE9-10删除无效值之前获取style属性的值.到目前为止,我已经尝试了以下各种变体 -

$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 null在显示在DOM中之前返回,基本上忽略解析时的属性.

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

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

如果你真的不能使用数据属性,另一个替代方法是以编程方式查看页面的源代码并将其解析为指定的值.我不推荐这个,但如果这是一个你想探索的途径,你可以在这里找到一个相关的问题.

更新:

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

虽然实现可能无法识别CSS声明块中的所有CSS属性,但是期望通过CSSStyleDeclaration接口提供对样式表中所有指定属性的访问.

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

这解释了为什么您在其他浏览器中获得预期结果.