Jquery introduces several ways to get objects
- 2020-03-30 01:24:20
- OfStack
1. Some of the core methods of JQuery
Each (callback) 'is like a loop
$(" Element "). The length; 'the number of elements is an attribute
$(" Element "). The size (); 'is also the number of elements, but having parentheses is a method
$(" Element "). The get (); 'a collection of elements on a page, stored as an array
$(" Element "). The get (index); The 'function is the same as above, index is the index of the array
$(" Element "). The get (). The reverse (); 'take the direction of the resulting array
$(" Element1 "). The index ($(" Element2 ")); The index value of 'element 2 in element 1 is.
2. Basic object acquisition (note that all objects obtained here are Jquery objects, not Dom objects, but they can be converted)
$("*") 'means to get all the objects but I haven't used it yet
$("#XXX") 'gets the element object with id=XXX (the id can be the id of the tag or the CSS style id) commonly used
$("input[name='username']") gets the name='username' element object commonly used in the input tag
$(".abc") 'gets the name of the style class. The element object of ABC is commonly used
$("div") 'tag selector selects all div elements commonly used
$("#a,.b,span") 'gets the element whose ID is a and the element that USES the class style b and all the span elements
$("# a.bp ") 'ID number is a and USES all p elements of the b style
3. Acquisition of hierarchical elements
$(" Element1 Element2 Element3..." ) 'before the parent and after the subset
$(" div > P ") 'gets all the p elements under div
$("div + p") the first p element after the 'div element
$("div ~ p") all the p elements after the 'div
4. Simple object acquisition
$("Element:first") the first Element of a type of Element in a 'HTML page
$("Element:last") the last Element of a class of elements in a 'HTML page
$("Element:not(selector)") 'removes all elements that match the given selector, such as $("input:not(:checked)") to select all unchecked check boxes
$("Element:even") 'gets an even number of rows
$("Element:odd ") 'gets an odd number of rows
$("Element:eq(index)") 'gets a given index value
$("Element:gt(index)") 'gets all the elements after the Element with the given index value
$("Element:lt(index)") 'gets all the elements preceding the Element with the given index value
5. Acquisition of content objects and object visibility
Contains the text content of text in the $("Element:contains(text)") 'Element
$('Element:empty") 'gets an Element that contains no child elements or text
$("Element:partnt") 'gets an Element that contains child elements or text
$("Element:has(selector)") 'whether or not it contains an Element, such as $("p:has(span)") represents all p elements that contain span elements
$("Element:hidden") 'selects all visible elements
$("Element:visible") 'selects all invisible elements
6. Other object acquisition methods
$("Element[id]") 'all elements with an id attribute
$("Element[attribute = youlika]" 'gets all the elements with an attribute of youlika
$("Element[attribute!= youlika]" 'gets all the elements whose attribute is not youlika
$("Element[attribute ^= youlika]" 'gets all elements whose attribute is not the beginning of youlika
$("Element[attribute $= youlika]" 'gets all elements whose attribute is not the end of youlika
$("Element[attribute *= youlika]" 'gets all the elements for which an attribute contains the beginning of youlika
$(" Element [selector1] [selector2] [...]. ") 'matches the attribute selector, such as $("input[id][name][value=youlika]") to get the input element with the id, name, and value being youlika.
7. Acquisition of child elements
$("Element:nth-child(index)") 'selects the NTH Element below the parent level
$("Element:nth-child(even)") 'selects the even number below the parent level
$("Element:nth-child(odd)") 'selects the odd number below the parent level
$("Element: NTH -child(3n+1)") 'expression
$("Element:first-child") 'selects the first child under the parent
$("Element:last-child") 'selects the last child below the parent
$("Element: sole-child ") 'matches a unique child of the parent, for example, dt is unique in the dl list, then dt is selected
8. Form object acquisition
$(:input)// finds all input elements, as well as drop-down lists, text fields, checkboxes, and so on.
$(:text)// matches all single-line text boxes
$(:password)// matches all password fields
$(:radio)// matches all radio buttons
$(:checkbox)// matches all check boxes
$(:submit)// matches all submit buttons
$(:image)// matches all image fields, for example
$(:reset)// matches all reset buttons
$(:button)// matches all the buttons
$(:file)// matches all file upload fields
$(:hidden)// matches all invisible elements or elements of type hidden
$(:enabled)// matches all available input elements, such as radio:enabled, which matches all available radio buttons
$(:disabled)// matches all the unavailable input elements
$(:checked)// matches all checked box elements
$(:selected)// matches all drop-down lists
9. Set and remove element attributes
$(" Element "). Attr (name) 'in the first match of attribute values, such as $(" img "). Attr (" SRC ")
$("Element".attr(key,value)") 'sets an attribute for an Element
$(" Element ". Attr ({key: value, key1: value,... })) 'set multiple attributes for an element at once
$("Element").attr(key,function) 'sets a computed attribute value for all matched elements.
$("Element"). RemoveAttr (name)// removes an attribute
Each (callback) 'is like a loop
$(" Element "). The length; 'the number of elements is an attribute
$(" Element "). The size (); 'is also the number of elements, but having parentheses is a method
$(" Element "). The get (); 'a collection of elements on a page, stored as an array
$(" Element "). The get (index); The 'function is the same as above, index is the index of the array
$(" Element "). The get (). The reverse (); 'take the direction of the resulting array
$(" Element1 "). The index ($(" Element2 ")); The index value of 'element 2 in element 1 is.
2. Basic object acquisition (note that all objects obtained here are Jquery objects, not Dom objects, but they can be converted)
$("*") 'means to get all the objects but I haven't used it yet
$("#XXX") 'gets the element object with id=XXX (the id can be the id of the tag or the CSS style id) commonly used
$("input[name='username']") gets the name='username' element object commonly used in the input tag
$(".abc") 'gets the name of the style class. The element object of ABC is commonly used
$("div") 'tag selector selects all div elements commonly used
$("#a,.b,span") 'gets the element whose ID is a and the element that USES the class style b and all the span elements
$("# a.bp ") 'ID number is a and USES all p elements of the b style
3. Acquisition of hierarchical elements
$(" Element1 Element2 Element3..." ) 'before the parent and after the subset
$(" div > P ") 'gets all the p elements under div
$("div + p") the first p element after the 'div element
$("div ~ p") all the p elements after the 'div
4. Simple object acquisition
$("Element:first") the first Element of a type of Element in a 'HTML page
$("Element:last") the last Element of a class of elements in a 'HTML page
$("Element:not(selector)") 'removes all elements that match the given selector, such as $("input:not(:checked)") to select all unchecked check boxes
$("Element:even") 'gets an even number of rows
$("Element:odd ") 'gets an odd number of rows
$("Element:eq(index)") 'gets a given index value
$("Element:gt(index)") 'gets all the elements after the Element with the given index value
$("Element:lt(index)") 'gets all the elements preceding the Element with the given index value
5. Acquisition of content objects and object visibility
Contains the text content of text in the $("Element:contains(text)") 'Element
$('Element:empty") 'gets an Element that contains no child elements or text
$("Element:partnt") 'gets an Element that contains child elements or text
$("Element:has(selector)") 'whether or not it contains an Element, such as $("p:has(span)") represents all p elements that contain span elements
$("Element:hidden") 'selects all visible elements
$("Element:visible") 'selects all invisible elements
6. Other object acquisition methods
$("Element[id]") 'all elements with an id attribute
$("Element[attribute = youlika]" 'gets all the elements with an attribute of youlika
$("Element[attribute!= youlika]" 'gets all the elements whose attribute is not youlika
$("Element[attribute ^= youlika]" 'gets all elements whose attribute is not the beginning of youlika
$("Element[attribute $= youlika]" 'gets all elements whose attribute is not the end of youlika
$("Element[attribute *= youlika]" 'gets all the elements for which an attribute contains the beginning of youlika
$(" Element [selector1] [selector2] [...]. ") 'matches the attribute selector, such as $("input[id][name][value=youlika]") to get the input element with the id, name, and value being youlika.
7. Acquisition of child elements
$("Element:nth-child(index)") 'selects the NTH Element below the parent level
$("Element:nth-child(even)") 'selects the even number below the parent level
$("Element:nth-child(odd)") 'selects the odd number below the parent level
$("Element: NTH -child(3n+1)") 'expression
$("Element:first-child") 'selects the first child under the parent
$("Element:last-child") 'selects the last child below the parent
$("Element: sole-child ") 'matches a unique child of the parent, for example, dt is unique in the dl list, then dt is selected
8. Form object acquisition
$(:input)// finds all input elements, as well as drop-down lists, text fields, checkboxes, and so on.
$(:text)// matches all single-line text boxes
$(:password)// matches all password fields
$(:radio)// matches all radio buttons
$(:checkbox)// matches all check boxes
$(:submit)// matches all submit buttons
$(:image)// matches all image fields, for example
$(:reset)// matches all reset buttons
$(:button)// matches all the buttons
$(:file)// matches all file upload fields
$(:hidden)// matches all invisible elements or elements of type hidden
$(:enabled)// matches all available input elements, such as radio:enabled, which matches all available radio buttons
$(:disabled)// matches all the unavailable input elements
$(:checked)// matches all checked box elements
$(:selected)// matches all drop-down lists
9. Set and remove element attributes
$(" Element "). Attr (name) 'in the first match of attribute values, such as $(" img "). Attr (" SRC ")
$("Element".attr(key,value)") 'sets an attribute for an Element
$(" Element ". Attr ({key: value, key1: value,... })) 'set multiple attributes for an element at once
$("Element").attr(key,function) 'sets a computed attribute value for all matched elements.
$("Element"). RemoveAttr (name)// removes an attribute