A fast CSS selector engine and matcher.
To include NWMatcher in a standard web page:
<script type="text/javascript" src="nwmatcher.js"></script>
To use it with Node.js:
$ npm install nwmatcher
NWMatcher currently supports browsers (as a global, NW.Dom
) and headless environments (as a CommonJS module).
Here is a list of all the CSS2/CSS3 Supported selectors.
You can read more about NWMatcher features and compliance on the wiki.
first( selector, context )
Returns a reference to the first element matching selector
, starting at context
.
match( element, selector, context )
Returns true
if element
matches selector
, starting at context
; returns false
otherwise.
select( selector, context, callback )
Returns an array of all the elements matching selector
, starting at context
. If callback
is provided, it is invoked for each matching element.
byId( id, from )
Returns a reference to the first element with ID id
, optionally filtered to descendants of the element from
.
byTag( tag, from )
Returns an array of elements having the specified tag name tag
, optionally filtered to descendants of the element from
.
byClass( class, from )
Returns an array of elements having the specified class name class
, optionally filtered to descendants of the element from
.
byName( name, from )
Returns an array of elements having the specified value name
for their name attribute, optionally filtered to descendants of the element from
.
getAttribute( element, attribute )
Return the value read from the attribute of element
with name attribute
, as a string.
hasAttribute( element, attribute )
Returns true element
has an attribute with name attribute
set; returns false
otherwise.
configure( options )
The following is the list of currently available configuration options, their default values and descriptions, they are boolean flags that can be set to true
or false
:
CACHING
: false - false to disable caching of result sets, true to enableESCAPECHR
: true - true to allow CSS escaped identifiers, false to disallowNON_ASCII
: true - true to allow identifiers containing non-ASCII (utf-8) charsSELECTOR3
: true - switch syntax RE, true to use Level 3, false to use Level 2UNICODE16
: true - true to allow identifiers containing Unicode (utf-16) charsSHORTCUTS
: false - false to disable mangled selector strings like "+div" or "ul>"SIMPLENOT
: true - true to disallow complex selectors nested in ':not()' classesSVG_LCASE
: false - false to disable matching lowercase tag names of SVG elementsUNIQUE_ID
: true - true to disallow multiple elements with the same id (strict)USE_HTML5
: true - true to use HTML5 specs for ":checked" and similar UI statesUSE_QSAPI
: true - true to use browsers native Query Selector API if availableVERBOSITY
: true - true to throw exceptions, false to skip throwing exceptionsLOGERRORS
: true - true to print console errors or warnings, false to mute themExample:
NW.Dom.configure( { USE_QSAPI: false, VERBOSITY: false } );
registerOperator( symbol, resolver )
Registers a new symbol and its matching resolver in the operators table. Example:
NW.Dom.registerOperator( '!=', 'n!="%m"' );
registerSelector( name, rexp, func )
Registers a new selector, with the matching regular expression and the appropriate resolver function, in the selectors table.
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.