Parsing CSS text in JSON with Javascript

Question

I just want something that takes a text box full of CSS and turns it into JSON using the CSS JSON method.

{ "selector-1":{ "property-1":"value-1", "property-n":"value-n" } } 

http://www.featureblend.com/css-json.html

Does anyone know something that decodes CSS in JSON? It would also be useful if he could encode it as well.

Answer 1

This js parser has both the methods you are looking for.

CSS JSON parser

 // To JSON var json = CSSJSON.toJSON(cssString); // To CSS var css = CSSJSON.toCSS(jsonObject); 

Or jQuery plugin analyzer.

jQuery parser

Css example:

 div div:first { font-weight: bold; -jquery: each(function() {alert(this.tagName);}) } div > span { color: red; } 

JSON output sent to the callback:

 { 'div div:first' : { 'font-weight' : 'bold', '-jquery': 'each(function() {alert(this.tagName);})' }, 'div > span' : { 'color': 'red' } } 

You can apply a css string to an element like this:

 var cssJSON = '{ "display": "none" }'; var obj = JSON.parse(json); $("#element").css(obj);