jquery - Parse Text CSS into JSON with Javascript - Stack Overflow

admin管理员组

文章数量:1289866

I just simply want something that will take a textarea full of CSS and turn it into JSON using the CSS JSON method.

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

.html

Does anyone know of something that will decode CSS into JSON? It would also be helpful if it could encode it as well.

I just simply want something that will take a textarea full of CSS and turn it into JSON using the CSS JSON method.

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

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

Does anyone know of something that will decode CSS into JSON? It would also be helpful if it could encode it as well.

• javascript
• jquery
• css
• json
• textarea

Share Improve this question Follow edited Apr 19, 2013 at 1:23 Case asked Apr 19, 2013 at 1:15 CaseCase 4,28255 gold badges3737 silver badges5555 bronze badges 2

• I don't know of any ready-made solution, but it wouldn't be too difficult to make something (particularly if the CSS is already parsed by the browser). – John Dvorak Commented Apr 19, 2013 at 1:17
• It's not really something I wanted to undertake. IE: dealing with background tags VS background-image I was hoping someone already solved those issues in order to save large amounts of time. – Case Commented Apr 19, 2013 at 1:19

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

This js parser has both 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 parser.

jQuery parser

Example css:

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 css string to an element like this:

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

$("#element").css(obj);

本文标签： jqueryParse Text CSS into JSON with JavascriptStack Overflow