JavaScript Selector Library Supports CSS4!

I was reading DailyJS and ran across this great JavaScript selector library called Sel.

It can select elements using the very brand new CSS4 features. The following are some examples.

/* subject overriding, was '$div .box' in a previous CSS4 draft,
   returns 'div' rather than '.box' */ div! .box
  /* id references, 'input' who's ID matches 'label's 'for' attribute */ label /for/ input
  /* case insensitive attribute matching */ [attr = "val" i]   /* :nth-match and :nth-last-match to match against sub-selectors */ div:nth-match(3 of .box)   /* links who's target absolute URI matches the current document's URI,
   arguments specify the degree of locality */ a:local-link(0)   /* :column */ td:column(col.profit)   /* :nth-column and :nth-last-column */ td:nth-column(even)

I've been hopeful that a selector engine would take on the challenge of CSS4 support. From what I understand about jQuery, CSS4 support would require a lot of rewriting Sizzle since it is so highly dependent on querySelectorAll(). I know that NWMatcher is a lot more robust in it's pre- and post-processing of selectors even when the browser supports querySelectorAll(). In other words, I'm thinking a selector engine needs to know when the browser supports CSS4 and use querySelectorAll() if possible even when CSS4 is not supported.


你可能感兴趣的:(JavaScript Selector Library Supports CSS4!)