SoFunction
Updated on 2025-04-14

Prototype User Guide Instructions

The following is the syntax of css2 selector. Of course, many browsers only support some of them. The Selector in Prototype mainly supports tag selector, class selector, id selector, and attribute selector, which basically contains all the types we usually use.

The following table summarizes CSS2 selector syntax, you can see in detailhttp:///TR/REC-CSS2/:

Pattern Meaning Described in section
* Matches any element. Universal selector
E Matches any E element (., an element of type E). Type selectors
E F Matches any F element that is a descendant of an E element. Descendant selectors
E > F Matches any F element that is a child of an element E. Child selectors
E:first-child Matches element E when E is the first child of its parent. The :first-child pseudo-class
E:link E:visited Matches element E if E is the source anchor of a hyperlink of which the target is not yet visited (:link) or already visited (:visited). The link pseudo-classes
E:active E:hover E:focus Matches E during certain user actions. The dynamic pseudo-classes
E:lang(c) Matches element of type E if it is in (human) language c (the document language specifies how language is determined). The :lang() pseudo-class
E + F Matches any F element immediately preceded by an element E. Adjacent selectors
E[foo] Matches any E element with the “foo” attribute set (whatever the value). Attribute selectors
E[foo=”warning”] Matches any E element whose “foo” attribute value is exactly equal to “warning”. Attribute selectors
E[foo~=”warning”] Matches any E element whose “foo” attribute value is a list of space-separated values, one of which is exactly equal to “warning”. Attribute selectors
E[lang|=”en”] Matches any E element whose “lang” attribute has a hyphen-separated list of values beginning (from the left) with “en”. Attribute selectors
HTML only. The same as DIV[class~=”warning”]. Class selectors
E#myid Matches any E element ID equal to “myid”. ID selectors

Selector contains Selector objects and classes.

The Selector object has the following two methods:

match(element):Whether the element matches this selector has been introduced in Element
findElements(parentNode):List of all descendants elements in parentNode that matches this selector

The usage method is also very simple var s=new Selector(expression); (element); ($(element)), whereThe expression can be as follows: "div", "#id", ".class", "div#id", "div[attribute]", "div[attribute=ffff]", "div[attribute!=sdf]"

Among them, Selector also has several static methods, which are:

matchElements(elements, expression):Returns a list of elements in elements that conform to expression
findElement(elements, expression, index):Returns the element indexed as index in the list of elements that conform to expression in elements
findChildElements(element, expressions):Find out the list of elements that conform to expressions in the descendants of elements of element, where expressions is an expression array, where expressions support the form "div li.#id"

$$ method:Just a simple callreturn (document, $A(arguments))

Although Selector has so many methods, most of them are called internally and we usually rarely use them because we have a convenient method $$, which is enough for most cases.