我正在使用CSS内容属性将一些值从我的LESS样式表传递给JavaScript(使用Canvas元素中的LESS中定义的一些颜色).
为了让我的生活更轻松,我决定以简单的方式放置这些值,以便在JavaScript中解析它们.
少量代码：
div#colorChart-critical {
content:'@{critical-highest},@{critical-veryhigh},@{critical-high},@{critical-low},@{critical-medium},@{critical-verylow}';
}
编译时带来以下CSS：
div#colorChart-critical6 {
content: '#ff0000,#ff7200,#fffc00,#0000ff,#a200ff,#00ff00';
}
然后我尝试使用jQuery读取它们：
$("div#colorChart-critical").css("content").split(",");
问题是在IE9中调用$(“div#colorChart-critical”).css(“content”)由于某种原因返回字符串“normal”. Opera,Firefox,Safari和Chrome工作正常.
为什么会在IE9中发生这种情况？
在IE9上解决这个问题？如果不是任何其他CSS属性我可以随机文本？
我可以使用类似的东西：
background: url(#ff0000,#00ff00);
但这会在控制台上产生错误.
最佳答案
这是因为CSS2.1中定义的内容不适用于元素,仅适用于：before和：after伪元素. IE9只是遵循这里的CSS2.1规范,其中mandates元素的内容总是被计算为正常.
我不知道为什么其他浏览器会返回你定义的值,特别是考虑到.css() makes use of getComputedStyle() on those browsers.如果他们正在实现CSS2.1内容,那么他们违反了CSS2.1而没有将值计算为正常值.如果他们正在准备一个晚期的CSS3实现,无论可能是什么,那么它们在某种程度上在实际元素上实现它是有道理的……无论如何都要羞辱它们.
这让我想到另一点：如果你实际上并没有尝试使用CSS来修改元素的内容,那么就不要使用内容,即使它没有定义用于元素的事实是你正在制作的原因首先使用这种技术.您可以尝试将这些颜色分配给某些类,创建隐藏元素并查询该元素的颜色样式.
