JavaScript和CSS标准扩展
今天早上读了CSS之神,Eric Meyer的blog文章JavaScript Will Save Us All(感谢Dexter Yy同学的分享),颇受启发。文章的大意是:既然W3C迟迟无法推广CSS3标准,我们可以使用成熟并已经在各大浏览器上有着良好支持的JavaScript来自己扩展CSS。
这个创意的根基源于Dean Edward的IE7 Script和一个新的开源project: Sizzle-未来可能作为jQuery上新的selector engine推出。
其比较大白话的解释是,在CSS中调用JavaScript。
例如想用CSS3里面的多张背景图片功能而大多数浏览器都不支持?那么可以在CSS中写一条自定制的CSS语句例如-mycss-multiple-background:,当selector engine扫描到该语句时,会自动调用相应的JavaScript代码,使用JS来实现多张背景图片的功能。Eric在文章中指出,尽管不是所有的CSS3属性都可以用该方法模拟,但这种自行扩展先进标准的方法有很多好处。
首先我们不必再容忍似乎永远都无法正式推广,浏览器支持参差不齐的CSS3标准。
然后我们还可以从这种”提前支持“实践中了解到哪些CSS属性是必要的,哪些则是不太会有实际用途的,从而更好的帮助W3C在新版CSS标准中对属性的取舍。
最棒的是,我们可以开发自定制的CSS属性!好像大浏览器厂商的自定制属性一样,我们可以创造例如-Jackyshadow-animation-speed这类属于自己品牌的CSS语句。
假如这种使用CSS语句调用JS的方法流行起来并且被植入到如jQuery一类的JS库中,其对前端开发的伟大意义是不言而喻的!
想象一下,对很多不擅长JS的前端和美工来说,这种方法意味着永远不必再跟JS代码打交道,只要将封装了CSS扩展支持的jQuery挂在网页上然后写相应的CSS代码即可完成以前必须调试JS代码才能完成的任务。例如直接写-jQuery-fade-in:500来控制动画速度,而不需要像以往一样需要钻到JS中寻找相应的代码做修改。
鉴于CSS的样式要远比JS简洁,即使是对精通JS的开发人员来说,这种方法也能在很大程度上提高开发,除错的效率。
像Eric Meyer一样,我也激动的等着这一天的到来。