Implementation of CSS3 selectors in JavaScript

A couple of years ago, there was a need for an implementation of CSS3 selectors in JavaScript (as a part of a debugging tool I was working on). The implementation is ready and tested, but is not needed anymore so I’ve decided to publish it for free download.

The implementation is almost 100% complete. It can even handle such things as unicode notations. For example, the following selector is processed exactly as per the spec:

:not(:root):not(form):first-child:not(:lang(en)) > div:first-child ~ div

The library uses standard DOM methods only, which means that there isn’t any pre-conversion of CSS selectors to an XPath expressions as other such libraries usualy do. The script hasn’t been much optimized in terms of speed and doesn’t work in IE. The main and only goal was to create an implementation that would follow the specification as much as possible and work in the Gecko family browsers.

You can try the library directly from your browser (unless you are using IE) on a demo page.

An application to the official W3C’s CSS3 selectors test suit is also available. Note that when performing those tests all !important statements are being ignored.

Tags: , ,

Leave a Reply