ホームページ  >  記事  >  ウェブフロントエンド  >  プロトタイプ使用ガイド selector.js description_prototype

プロトタイプ使用ガイド selector.js description_prototype

WBOY
WBOYオリジナル
2016-05-16 18:59:271186ブラウズ

下面是css2 selector的语法,当然很多浏览器只是支持其中的一部分,Prototype 中的Selector主要支持tag选择器、class选择器和id选择器,还有属性(attribute)选择器,基本上包含我们平时所用的所有类型

The following table summarizes CSS2 selector syntax, 详细的可以看http://www.w3.org/TR/REC-CSS2/selector.html:

Pattern Meaning Described in section
* Matches any element. Universal selector
E Matches any E element (i.e., 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
DIV.warning HTML only. The same as DIV[class~=”warning”]. Class selectors
E#myid Matches any E element ID equal to “myid”. ID selectors

セレクターにはセレクター オブジェクトとクラスが含まれます。

Selector オブジェクトには次の 2 つのメソッドがあります:

match(element): 要素がこのセレクターと一致するかどうかは、要素
findElements(parentNode): のリストで導入されました。このセレクターに一致するparentNode内のすべての子孫要素

使用方法も非常に簡単です: var s=new Selector(expression); s.findElements($(element)); ここで、expression は次のとおりです。以下のように「div」、「#id」、「.class」、「div#id」、「div[attribute]」、「div[attribute=fff]」、「div[attribute!=sdf]」

セレクターにはいくつかの静的メソッドもあります。

matchElements(elements,expression):expression に一致する要素内の要素のリストを返します
findElement(elements,expression,index):戻り値 要素 式に一致する要素のリスト内のインデックス Index を持つ要素
findChildElements(element,expressions): 次の子孫要素を検索しますelement 式に一致する要素のリスト。ここで、式は式の配列であり、式は "div li.#id" の形式をサポートします

$$ メソッド: 単に return Selector.findChildElements(document, $A(arguments)) を呼び出すだけです

セレクターはたくさんありますが、メソッドですが、そのほとんどは内部で呼び出され、ほとんどの状況では十分な便利なメソッド $$ があるため、ほとんど使用されません

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。