You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

67 lines
2.0 KiB

  1. # CSSOM
  2. CSSOM.js is a CSS parser written in pure JavaScript. It is also a partial implementation of [CSS Object Model](http://dev.w3.org/csswg/cssom/).
  3. CSSOM.parse("body {color: black}")
  4. -> {
  5. cssRules: [
  6. {
  7. selectorText: "body",
  8. style: {
  9. 0: "color",
  10. color: "black",
  11. length: 1
  12. }
  13. }
  14. ]
  15. }
  16. ## [Parser demo](http://nv.github.com/CSSOM/docs/parse.html)
  17. Works well in Google Chrome 6+, Safari 5+, Firefox 3.6+, Opera 10.63+.
  18. Doesn't work in IE < 9 because of unsupported getters/setters.
  19. To use CSSOM.js in the browser you might want to build a one-file version that exposes a single `CSSOM` global variable:
  20. ➤ git clone https://github.com/NV/CSSOM.git
  21. ➤ cd CSSOM
  22. ➤ node build.js
  23. build/CSSOM.js is done
  24. To use it with Node.js or any other CommonJS loader:
  25. ➤ npm install cssom
  26. ## Don’t use it if...
  27. You parse CSS to mungle, minify or reformat code like this:
  28. ```css
  29. div {
  30. background: gray;
  31. background: linear-gradient(to bottom, white 0%, black 100%);
  32. }
  33. ```
  34. This pattern is often used to give browsers that don’t understand linear gradients a fallback solution (e.g. gray color in the example).
  35. In CSSOM, `background: gray` [gets overwritten](http://nv.github.io/CSSOM/docs/parse.html#css=div%20%7B%0A%20%20%20%20%20%20background%3A%20gray%3B%0A%20%20%20%20background%3A%20linear-gradient(to%20bottom%2C%20white%200%25%2C%20black%20100%25)%3B%0A%7D).
  36. It doesn't get preserved.
  37. If you do CSS mungling, minification, image inlining, and such, CSSOM.js is no good for you, considere using one of the following:
  38. * [postcss](https://github.com/postcss/postcss)
  39. * [reworkcss/css](https://github.com/reworkcss/css)
  40. * [csso](https://github.com/css/csso)
  41. * [mensch](https://github.com/brettstimmerman/mensch)
  42. ## [Tests](http://nv.github.com/CSSOM/spec/)
  43. To run tests locally:
  44. ➤ git submodule init
  45. ➤ git submodule update
  46. ## [Who uses CSSOM.js](https://github.com/NV/CSSOM/wiki/Who-uses-CSSOM.js)