我已经添加了一个变量到CSSStyleDeclaration原型，但不能修改它

我不太了解原型，所以它可能是我的错，但理论上如果我添加一个变量到原型，我将能够改变它的实例，对吧？

下面的代码：我已经添加了一个变量到CSSStyleDeclaration原型，但不能修改它

<head> 
     <script> 
      CSSStyleDeclaration.prototype["foo"] = "something"; 
     </script> 
    </head> 
    <body> 
     <div style="foo:'maybe'" id ="myId"></div> 
     <script> 
      var el = document.getElementById("myId"); 
      console.log(el.style.foo); 
     </script> 
    </body>

控制台将返回 “东西”，为什么呢？

来源

2016-03-08 fedeTibaldo

如果返回'“东西”'，这意味着它已被修改“导致它的原始值是“也许”......对吧？我看不到它没有修改。 –

这是因为foo是不是一个标准的属性，所以

当您设置cssText，该声明被忽略
既然已被忽略，getPropertyValue不会已经能够检索值。
取而代之，您尝试通过camel-cased getter获取它，但这些获得者仅存在于supported CSS properties。

然而，在支持CSS variables浏览器，你可以使用它们：

function getFoo(el) { 
 
    return getComputedStyle(el).getPropertyValue('--foo'); 
 
} 
 
snippet.log("body: " + getFoo(document.body)); 
 
snippet.log("#myId: " + getFoo(document.getElementById('myId')));

* { 
 
    --foo: 'something'; 
 
}

<div style="--foo: 'maybe'" id="myId"></div> 
 
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --><script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

来源

2016-03-08 18:29:28 Oriol

非常感谢。我一直在尝试用自定义CSS前缀和骆驼套装属性：D现在我明白了 – fedeTibaldo

我已经添加了一个变量到CSSStyleDeclaration原型，但不能修改它

回答

相关问题