Summary of selectors in jQuery

There are many selectors in jQuery, such as basic selectors, form selectors, filter selectors, etc. Some of them are easy to forget if you don’t use them often. I recently made a summary of the selectors in jQuery for your convenience. Check it out and share it with everyone, I hope it can help you.

Basic selector

//ID selector $("#id")

//Element selector $("div")

//Class Selector $(".classname")

//Combined Selector $(".classname,.classname1,#id1")

Hierarchical selector

//Child element selector $("#id>.classname")

//Descendant element selector $("#id .classname")

//The next element selector $("#id .classname")

//Sibling element selector $("#id ~ .classname")

Filter selector

//The first li $("li:first")

//The last li $("li:last")

//Select the li whose subscript is an even number $("li:even")

//Select the li whose subscript is an odd number $("li:odd")

//li with subscript equal to 4 $("li:eq(4)")

//li with subscript greater than 2 $("li:gt(2)")

//Li with subscript less than 2 $("li:lt(2)")

//Select all li except id="runoob" $("li:not(#runoob)" )

Content filter selector

// Elements containing Runob text $("div:contains('Runob')")

/ /Empty element that does not contain child elements or text $("td:empty")

//Contains elements matched by the selector $("div:has(selector)")

//Elements containing child elements or text $("td:parent")

Visibility filter selector

//Match all invisible elements, or type For hidden elements $("li:hidden")

//Match all visible elements $("li:visible")

Attribute filter selector

//All div elements containing the id attribute $("div[id]")

// div elements with the id attribute value 123 $("div[id='123']" )

// div elements whose id attribute value is not equal to 123 $("div[id!='123']")

// div elements whose id attribute value starts with qq $ ("div[id^='qq']")

// div element whose id attribute value ends with zz $("div[id$='zz']")

// The div element whose id attribute value contains bb $("div[id*='bb']")

//Multi-attribute filtering, elements that meet the conditions of both attributes at the same time $("input [id][name$='man']")

Status filter selector

// Match available input $("input:enabled")

// Match unavailable input $("input:disabled")

// Match selected input $("input:checked")

// Match selected option $("option:selected")

Form selector

//Match all input, textarea, select and button elements $(":input")

//For all single-line text boxes, $(":text") is equivalent to $("[type=text]"). It is recommended to use $("input:text") for higher efficiency. Next Same as $(":text")

//All password boxes $(":password")

//All radio buttons $(":radio")

//All checkboxes $(":checkbox")

//All submit buttons $(":submit")

//All reset buttons $(":reset" )

//All button buttons $(":button")

//All file fields $(":file")

The above is the detailed content of Summary of selectors in jQuery. For more information, please follow other related articles on the PHP Chinese website!