-
Notifications
You must be signed in to change notification settings - Fork 0
Selectors
tiny.js features full CSS2.1 selectors - and the irregular parent(s) selectors "<" and "<<". Multiple selectors in one selection as well as multiple selections, splitted with ",", are possible.
The Selector function t works like this:
t(selection, base, returnAsArray)- selection: String containing a valid CSS2.1 selector
- base: node(s) on which the selection is based
- returnAsArray: if set, the result will be a simple array without Methods
The selector filters are stored in the object t.cf and therefore are easily extendable with Plugins.
The Selector engine has a small optimization regarding basic selectors that can be covered with the DOM-getElement-Methods.
t('body') will select every Node with the given tagname, e.g. 'body' or even '*'.
t('.text') selects all Nodes with the className 'text'.
t('#header') returns the Node with the id 'header'.
t('[name=password]') scrounges the document for all Nodes with the name 'password'.
Traversing shorthands like ~, +, > are also implemented, but less optimized.
t('*') selects all nodes insode the current selected nodes (or inside document, if no base given).
t('body > div') returns all div-Nodes which are direct childNodes of the body-Tag.
t('a ~ span') will collect all spans that are siblings to an a-Tag.
t('a + b') will only return b-Tags with an a-Tag as the previous Node.
This selector is not a valid CSS2.1-Selector, but I sure wish it was, because it is so practical.
t('<', node) returns the first parent of the given node.
Another Nonstandard-Selector. Same as before, but doesn't stop until it hits document.
t('[title]') will collect all nodes with any truthy title attribute.
t('[value=1]') returns a selection of all nodes with their value attribute set to "1".
t('[placeholder!=Searchterm]') selects all nodes with a placeholder attribute other than "Searchterm".
t('[value^=49]') will find all nodes with a value attribute starting with "49".
t('[value$=test]') yields all nodes with a value ending on "test".
t('[placeholder*=mobile]') searches all nodes that have "mobile" somewhere in their value.
t('[value~=javascript]') should return all nodes that have "javascript" as a delimited subpart in their value Attribute (e.g. for tagging).
t('[lang|=en]') selects all nodes with their lang attribute set to any english dialect.
t('#table7 tr:odd') collects every second row of #table7.
t('#table7 tr:even') returns every other second row.
t('li:empty') will sum up all list-nodes without content.
t('li:first-child') selects every list-node that is first in its parent list.
t('li:last-child') returns the last list-node of any list.
t('li:only-child') will search all list-nodes that are all alone in their list (which would be a bit stupid, because it is not very semantic to list up only one item).
t('li:nth-child(2)') collects the second li in any list.
Not inverses any simple selectors (due to limitations in the selector engine, any selectors with brackets will probably fail).
t('object:not(:empty)') will return all object tags that have any tag content.
Has allows to select nodes based on their children (same limitations apply).
t('table:has(thead)') only returns table that have a thead-Tag inside them.
Contains selects Nodes based on their textual content (no brackets again).
t('span:contains(tinyjs)') selects those spans with "tinyjs" in their text.
t('html:lang(en)') probably explains itself (otherwise just ask).