jQuery.Rule (via) jQuery plugin for manipulating stylesheet rules. For me, this is the single most important piece of functionality currently missing from the core jQuery API. The ability to add new CSS rules makes an excellent complement to the .live() method added in jQuery 1.3.
Sign in with 
OpenID
I think you overstate the usefulness of the plugin. Using this plugin, users are now limited by what selectors that can use (they can only use what the browsers provide - and are at the mercy of the cross-browser bugs that are there) which is a huge problem. Not to mention that it encourages the un-separation of markup/css/js (by writing more css in js).
While it may be technologically neat, it just doesn't fit with the jQuery philosophy in its current state.
Hmm... I hadn't considered the difference in semantics between browser CSS and jQuery CSS - that's pretty nasty.
It does feel really strange to me that I can inject new content in to a page, have the events for that selector magically apply, but not have the same thing happen for styles. The ugliest bits of my jQuery code are the calls to .css() - which I suppose should encourage me to abstract them out in to CSS classes a little more vigourously.
Given the choice between consistent ability-to-apply-live-styles-and-events and consistent-semantics-for-css-selectors, I can totally see why it's more sensible to keep this kind of thing as a plugin.
What do you think of something like $.getStylesheet(url) as a partner to $.getScript(url)?
>$.getStylesheet(url)
Wouldn't that still need to be processed thru Javascript and have the same issues of un-separation John mentioned? Loading a css file after page is loaded has no effect on the styles.
picardo - 22nd February 2009 23:13 - #
Simon, if calls to .css() method cause bloat in your scripts, then you probably want to do classname switching. It's also faster when it comes to browser redraws.
For me, a method to dynamically update the stylesheet would only be useful for injecting rules to hide ("display: none") certain elements so that I can show them later with JS -- and no, I don't think DOMContentLoaded event is early enough for this.
$.getStylesheet(url) (or similar) is definitely something that we've been considering. Being able to asynchronously load the stylesheets would be very useful (and, no, they wouldn't have to be processed by JS explicitly, it's just loading a new stylesheet - which will affect the style styling on the page, even if loaded later).
That's actually the first item on our 1.3.x/1.4 roadmap:
http://docs.jquery.com/JQuery_1.4_Roadmap#Core
(Although, I should be clear that the above URL is just a dump of all the ideas that we've had - some may make it in, some may not.)
Both ideas are pretty bad, from content/presentation/behaviour separation standpoint.
IMO, the best way to maintain loose-coupled connections between javascript and stylesheets is to add/remove class-names - and at most lazy-load a stylesheet file.
Már - 22nd February 2009 23:32 - #
document.write('<style type="text/css">#foo { display: none }</style>')to solve that problem but it's a ferociously ugly hack :/Sort of wish there was a Zen of Javascript (or Web Standards) like there is for Python ... specifically this section:
huxley - 23rd February 2009 13:52 - #
I was pretty excited to see this.
I've got a project where I think this could be very useful: We need to inject style rules into the embedded iframe used by a rich text editor (it does exactly what Mislav considers the only appropriate use case -- injects "display: none;" so that the elements can be replaced later).
Because the elements we want to hide do not necessarily exist in the iframe ahead of time, jQuery.rules() seems like an ideal solution as compared to the document.write() trick (which I'm using currently) or asking the person configuring the RTE to load in a CSS file that contains the appropriate rules.
David Eads - 27th February 2009 17:24 - #
I found a very good use for the rule plugin - really fast animation of many elements where Javascript is too slow. I've made it into a plugin that you can test on http://code.zemanta.com/fry/ruleanimation/.