Which JavaScript-framework can search CSS stylesheet rules and edit their properties?

Question

The Question

Which JavaScript framework (prototype, script.aculo.us, Mootools, MochiKit...) has decent CSS rule editing support?

This is abou

Answer 1

As you noted, YUI has the StyleSheet utility http://developer.yahoo.com/yui/3/stylesheet/

Example:

var sheet = new Y.StyleSheet(styleNode);
sheet.set('.hover, .foo:hover', {
    background: 'red',
    color: '#fff'
});

It also supports creating stylesheets from scratch by passing the constructor a string of css rules.

Note that the same origin policy prevents accessing the rules of remotely sourced link nodes.

It doesn't yet support accessing the rules as an object tree or accessing specific properties of rules. It does support removing rules or properties of rules, though. Today, the best you can do for working with the rules as objects would be something like

var style = sheet.getCssText('.foo'),
    tmp = document.createElement('div');

tmp.style.cssText = sheet.getCssText('.foo');
if (tmp.style.display) { // does the rule include a setting for display
    ...
}

Since messing with stylesheets at runtime is pretty rarely the right solution, the utility hasn't had a lot of developer focus for adding features. Feature requests are welcome, of course.