سلکتور ها
Neshoonak selectors allow you to select element(s) in the HTML document tree. They are used to select HTML elements based on their id, classes, types, attributes, values of attributes and much more. It's similar to JQuery selectors and CSS Selectors, and in addition, it has some own custom selectors.
Following table lists all valid selector rules in Neshoonak. Rules maked as yellow are custom rules defined in neshoonak and may differ from JQuery or CSS rules.
| Selector | Example | description |
|---|---|---|
| .class | .intro | Selects all elements with class="intro" |
| #id | #firstname | Selects the element with id="firstname" |
| element | p | Selects all <p> elements |
| element,element | div,p | Selects all <div> elements and all <p> elements |
| parent descendant | div p | Selects all <p> elements inside <div> elements |
| parent>child | div > p | Selects all <p> elements where the parent is a <div> element |
| element+next | div + p | Selects all <p> elements that are placed immediately after <div> elements |
| element1~siblings | p ~ ul | Selects every <ul> element that are preceded by a <p> element |
| [index] | [0, -1] | Selects first and last element |
| [attribute] | [target] | Selects all elements with a target attribute |
| [attribute=value] | [target=_blank] | Selects all elements with target="_blank" |
| [attribute~=value] | [title~=flower] | Selects all elements with a title attribute containing the word "flower" |
| [attribute|=value] | [lang|=en] | Selects all elements with a lang attribute value starting with "en" |
| [attribute^=value] | a[href^="https"] | Selects every <a> element whose href attribute value begins with "https" |
| [attribute$=value] | a[href$=".pdf"] | Selects every <a> element whose href attribute value ends with ".pdf" |
| [attribute*=value] | a[href*="w3schools"] | Selects every <a> element whose href attribute value contains the substring "w3schools" |
| [attribute!=value] | [href!='default.htm'] | All elements with a href attribute value not equal to "default.htm" |
Functional Selecotrs
| Selector | Example | description |
|---|---|---|
| :eq(index) | ul li:eq(3) | The fourth element in a list (index starts at 0) |
| :first | p:first | The first <p> element |
| :last | p:last | The last <p> element |
| :even | tr:even | All even <tr> elements |
| :odd | tr:odd | All odd <tr> elements |
| :gt(no) | ul li:gt(3) | List elements with an index greater than 3 |
| :lt(no) | ul li:lt(3) | List elements with an index less than 3 |
| :slice(start, stop) | li:slice(3,6) | Selects a subset of elements based on indices 3,4,5,6 |
| :header | :header | All header elements <h1>, <h2> ... |
| :first-child | p:first-child | All <p> elements that are the first child of their parent |
| :last-child | p:last-child | All <p> elements that are the last child of their parent |
| :nth-child(n) | p:nth-child(2) | All <p> elements that are the 2nd child of their parent |
| :only-child | p:only-child | All <p> elements that are the only child of their parent |
| :not(selector) | input:not(:empty) | All input elements that are not empty |
| :has(selector) | div:has(p) | All <div> elements that have a <p> element |
| :contains(text) | :contains('Hello') | All elements which contains the text "Hello" |
| :match(text) | :match('^THE') | All elements which contains the text starts with "THE" |
| :notmatch(text) | :notmatch('^THE') | All elements which dosenot contains text starts with "THE" |
| :empty | :empty | All elements that are empty |
| :isparent | :isparent | All elements that are a parent of another element (equal to standard :PARENT function in jquery) |
| :button | :button | All input elements with type="button" |
| :checkbox | :checkbox | All input elements with type="checkbox" |
| :file | :file | All input elements with type="file" |
| :image | :image | All input elements with type="image" |
| :input | :input | All input elements |
| :password | :password | All input elements with type="password" |
| :radio | :radio | All input elements with type="radio" |
| :reset | :reset | All input elements with type="reset" |
| :submit | :submit | All input elements with type="submit" |
| :text | :text | All input elements with type="text" |
| :parent([filter]) | p:parent | Selects direct parent of all <p> elements |
| :parents([filter]) | p:parents | Selects all parents of all <p> elements |
| :parentsUntil(filter) | :parentsUntil('div') | Get the ancestors of each element in the current set of matched elements, up to but not including the element matched by the 'div' |
| :closest(filter) | :closest('div') | Like jquery standard function |
| :next([filter]) | :next | Like jquery standard function |
| :nextAll([filter]) | :nextAll | Like jquery standard function |
| :nextUntil(filter) | :nextUntil('div') | Like jquery standard function |
| :prev([filter]) | :prev | Like jquery standard function |
| :prevAll([filter]) | :prevAll | Like jquery standard function |
| :prevUntil(filter) | :prevUntil('div') | Like jquery standard function |
| :siblings([filter]) | :siblings | Like to jquery standard function |
| :skip(start, stop) | :skip(1,-1) | ignores first and last elements |
| :root | p:root | Selects the document's body element |
| @JSON | @JSON main > pepole[3] > name | Equals to main.people[3].name in javascript |