Difference between revisions of "JQuery"
Jump to navigation
Jump to search
| Line 7: | Line 7: | ||
* $("p a.specialClass") - matches links with an id of specialID and a class of specialClass | * $("p a.specialClass") - matches links with an id of specialID and a class of specialClass | ||
===Child, Container, and attribute selectors=== | ===Child, Container, and attribute selectors=== | ||
| − | * $("p a") - return link elements that are descendents of | + | * $("p a") - return link elements that are descendents of p tag |
* read the selectors backwards | * read the selectors backwards | ||
| − | * $("p > a") - return link elements who have a | + | * $("p > a") - return link elements who have a p for a parent element |
| − | * $("ul.myList > li > a") - return link elements who are children of a | + | * $("ul.myList > li > a") - return link elements who are children of a li element, which are in turn children of a ul element of class "myList" |
| − | * $("p+a") - matches link elements immediately preceded by sibling | + | * $("p+a") - matches link elements immediately preceded by sibling p tag |
| − | * $("p~a") - matches link elements preceded by any sibling | + | * $("p~a") - matches link elements preceded by any sibling p tag |
* $("a[href^=http://]") - return any link elements, the beginning of whose href attribute matches "http://" | * $("a[href^=http://]") - return any link elements, the beginning of whose href attribute matches "http://" | ||
* $("form[method]") - return any form element that simply has an explicit method attribute | * $("form[method]") - return any form element that simply has an explicit method attribute | ||
| Line 19: | Line 19: | ||
* $("a[href$=.pdf]") | * $("a[href$=.pdf]") | ||
* $("a[href*=jquery.com]") | * $("a[href*=jquery.com]") | ||
| − | * $("li:has(a)") - return any | + | * $("li:has(a)") - return any li element that has a link element in it |
* only one level of nesting supported this way | * only one level of nesting supported this way | ||
* $("foo:not(bar:has(baz))") - this is ok | * $("foo:not(bar:has(baz))") - this is ok | ||
Revision as of 20:44, 5 October 2009
Selector Syntax
Basic CSS selectors
- $("a") - matches all link (<a>) elements
- $("#specialID") - matches elements that have an id of specilID
- $(".specialClass") - matches elements that have the class of specialClass
- $("a#specialID.specialClass") - matches links with an id of specialID and a class of special Class.
- $("p a.specialClass") - matches links with an id of specialID and a class of specialClass
Child, Container, and attribute selectors
- $("p a") - return link elements that are descendents of p tag
- read the selectors backwards
- $("p > a") - return link elements who have a p for a parent element
- $("ul.myList > li > a") - return link elements who are children of a li element, which are in turn children of a ul element of class "myList"
- $("p+a") - matches link elements immediately preceded by sibling p tag
- $("p~a") - matches link elements preceded by any sibling p tag
- $("a[href^=http://]") - return any link elements, the beginning of whose href attribute matches "http://"
- $("form[method]") - return any form element that simply has an explicit method attribute
- $("input[type=text]") - return any input element with a type attribute of text
- $("div[title^=my]") - return any div element whose title attribute starts with "my"
- $("a[href$=.pdf]")
- $("a[href*=jquery.com]")
- $("li:has(a)") - return any li element that has a link element in it
- only one level of nesting supported this way
- $("foo:not(bar:has(baz))") - this is ok
