如何获取样式属性值之前IE9剥它 [英] How to get style attribute value before IE9 strips it

查看:98
本文介绍了如何获取样式属性值之前IE9剥它的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图抓取样式属性的值之前IE9-10剥离无效值。到目前为止,我已经尝试过以下每一种变化 -



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



但是似乎如果我尝试设置一个无效的值,我无法访问它 -

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

< / div>

上述所有操作只返回 display:none 因为IE9-10删除了无效的值。



注意,我已经尝试了大量的变化,所以如果不可能是很好,但


解决方案您可以尝试

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



如果我们来看看规范,我们可以假设发生了什么(强调我的):



< blockquote>

6.7.1解析CSS值



要解析给定属性的CSS值,意味着遵循这些
步骤:




  • 让list是从值中调用组件
    值的列表返回的值。



  • 如果上述步骤符合失败,返回 null


  • >


由于您的自定义颜色值与color属性的语法不匹配,因此IE会返回<$ c $






null ,基本上忽略parse上的属性。 p>虽然你已经提到你不想,我再次建议你使用一个数据属性代替,这将为您提供一个跨平台的解决方案:

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






另一个选择,如果你真的不能带自己使用数据属性,是以编程方式查看页面的源,并解析为您指定的值。我不建议这样做,但如果这是您希望探索的途径,您可以在此处找到相关问题。 / p>




更新



,如果我们查看 CSS样式的DOM规范我们发现这是:


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


作为我上一个答案的更新,我推测IE9不正确地解释规范 - 在DOM解析期间使用CSSOM return null 实现(或类似的东西),而不是预期的DOM实现。



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


I'm trying to grab the value of the style attribute before IE9-10 strips invalid values out. So far I've tried every variation of the following -

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

But it seems if I try to set an invalid value I cannot get access to it -

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

</div>

All of the above would only return display: none since IE9-10 strips out the invalid values.

As a note I have tried tons of variations so if it is not possible that is fine but have you tried or can you try answers don't help much unless they are confirmed to do something :)

解决方案

Unfortunately, due to the manner in which IE9 implements the CSS Object Model specification, this is not possible.

If we take a look at the specification, we can assume the following is what happens (emphasis mine):

6.7.1 Parsing CSS Values

To parse a CSS value value for a given property means to follow these steps:

  • Let list be the value returned by invoking parse a list of component values from value.

  • Match list against the grammar for the property property in the CSS specification.

  • If the above step failed, return null.

  • Return list.

Since your custom color value does not match against the grammar for the color property, IE returns null, essentially ignoring the property on parse, before it is displayed in the DOM.


Although you have mentioned that you don't want to, I recommend again that you use a data attribute instead, which will provide you with a cross-platform solution:

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


A further alternative, if you really cannot bring yourself to use data attributes, is to view the source of the page programatically and parse it for your specified value. I do not recommend this, but if this is an avenue you wish to explore, you can find a related question here.


Update:

Interestingly, if we look at the DOM spec for CSS Style Declarations we find this:

While an implementation may not recognize all CSS properties within a CSS declaration block, it is expected to provide access to all specified properties in the style sheet through the CSSStyleDeclaration interface

So as an update on my previous answer, I speculate that IE9 is incorrectly interpreting the specification - using the CSSOM return null implementation (or something akin to it) during DOM parsing, instead of the intended DOM implementation.

This explains why you get the expected outcome in other browsers.

这篇关于如何获取样式属性值之前IE9剥它的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆