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 Parsing CSS Values

解析给定属性的CSS值意味着要遵循这些值   步骤进行：



让list成为通过调用解析组件列表返回的值   来自价值的价值。



匹配CSS中属性属性语法的列表   说明书



如果上述步骤失败，请返回null 。



返回列表。

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

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

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

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

<强>更新：

有趣的是，如果我们查看CSS Style Declarations的DOM规范，我们会发现：

虽然实现可能无法识别a中的所有CSS属性 CSS声明块，它有望提供所有访问权限通过样式表中指定的属性 CSSStyleDeclaration接口

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

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

Answer 2

你能不能在你的元素上使用自定义属性来保持＆＃34;无效＆＃34;数据？与<element data-custom-attribute="some invalid stuff"></element>一样。

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

Answer 3

这完全是开箱即用的，但如果您只需阅读该属性，为什么不使用outerHTML并从那里获取值，例如：

var a = document.getElementById('myDiv').outerHTML;
var i = a.search('color:');
var e = a.lastIndexOf('"');
var result = a.substr(i+6,e - (i+6));
alert(result);

编辑1： 由于之前的答案不起作用，我尝试了其他一些替代方案，并且我能够在style标签上添加内容的唯一方法是实际保留它：

style="display:none; -ms-custom: test;"

编辑2 如果你需要添加一个不被IE剥离的自定义样式，你可以在它之前添加-ms-，只有IE才能读取它，因为它-ms所以它是{1}}安全

Answer 4

嗯......我认为你需要对该元素使用ng-style。将以不同的方式评估Ng样式，并在此之后使用适当的值填充元素的样式。通常，您将agular评估元素放在相应的角度指令中。在你的情况下，这是ng风格。

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

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

4 个答案: