Jquery gets the setting and removal of the object and attributes of the specified tag_jquery

1. Let’s talk about the concept of JQuery first. JQuery was first created by a man named John Resig from America. Later, many JS experts also joined the team. In fact, JQuery is a JavaScript class library. This class library integrates many functional methods. Using the class library, you can use some simple codes to achieve some complex JS effects.

2. JQuery realizes the separation of codes. There is no need to add events such as onclick to call functions in the web page. You can directly introduce the JQuery class library and the JQuery code written by yourself;
For example:

In the above code, as long as Element is defined, the click behind this element is the action
alert ("Click on me!"); this is the code to be executed. Of course, you can have many operations in this function;

The $ sign here represents JQuery, which is a reference to the class library. . . This is how I understand it;

3. Some of the core methods of JQuery

each(callback) 'Like a loop

$("Element").length; ' The number of elements is an attribute

$(“Element”).size(); 'It is also the number of elements, but with parentheses it is a method

$(“Element”).get (); 'A collection of elements in the page, stored in the form of an array

$("Element").get(index); 'The function is the same as above, index represents the element, Index of the array

$(“Element”).get().reverse(); 'Change the direction of the obtained array

$(“Element1″).index($(“Element2 ″)); 'The index value of element 2 in element 1 is. . .

4. Basic object acquisition

$(“*”) ‘Indicates getting all objects

$(“#element”) ‘Getting the same ID number as in CSS

$(".abc") 'All elements using .abc style

$("div") 'The tag selector selects all div elements

$( "#a,.b,span") 'Indicates getting the element with ID a, the element using class style b and all span elements

$("#a .b p") 'The ID number is a and uses all p elements of b style

5. Obtaining hierarchical elements

$("Element1 Element2 Element3 ....") 'The parent in front is followed by the subset

$("div > p") 'Get all p elements below the div

$("div p") 'The first p element after the div element

$("div ~ p") 'All p elements after div

6. Simple object acquisition

$("Element:first") 'The first element of a certain type of element in the HTML page An element

$("Element:last") 'The last element of a certain type of element in the HTML page

$("Element:not(selector)") 'Remove all elements with the given Specify the elements matched by the selector, such as: $("input:not(:checked)") means selecting all unchecked check boxes

$("Element:even") 'Get even rows

$("Element:odd") 'Get odd rows

$("Element:eq(index)") 'Get a given index value

$(" Element:gt(index)") 'Get all elements after the element with a given index value

$("Element:lt(index)") 'Get all elements before the element with a given index value

. . .

7. Acquisition of content objects and object visibility

$("Element:contains(text)") 'Whether the element contains text content

$(' Element:empty") 'Get the

$("Element:partnt") 'Get the

$("Element:has (selector)") 'Whether it contains a certain element, such as: $("p:has(span)") means all p elements containing span elements

$("Element:hidden") 'Select all Visible elements

$(“Element:visible”) 'Select all invisible elements

8. Other object acquisition methods

$(“Element[id]“) ' All elements with ID attributes

$("Element[attribute = youlika ]" 'Get all elements with an attribute of youlika

$("Element[attribute != youlika ]" 'Get all the elements that have a certain attribute that is not youlika

$("Element[attribute ^= youlika]" 'Get all the elements that start with a certain attribute that is not youlika

$(" Element[attribute $= youlika ]" 'Get all elements with an attribute that does not end with youlika

$("Element[attribute *= youlika ]" 'Get all elements with an attribute that starts with youlika

$("Element[selector1][selector2][....]") 'Conforms to the attribute selector, such as $("input[id][name][value=youlika]") means to obtain The input elements with ID, Name and value are youlika

9. Obtaining child elements

$("Element:nth-child(index)") 'Select the one below the parent. The nth element

$("Element:nth-child(even)") 'Select the even number below the parent

$("Element:nth-child(odd)") ' Select the odd number below the parent

$(“Element:nth-child(3n 1)”) ‘Expression

$(“Element:first-child”) ‘Select the odd number below the parent The first child element

$("Element:last-child") 'Select the last child element below the parent

$("Element:only-child") 'Match The only child element under the parent, for example, dt is the only one in the dl list, then dt

10. Get the form object

$(:input)//Find all Input elements, of course, include drop-down lists, text fields, radio buttons, check boxes, etc.

$(:text)//Match all single-line text boxes

$(:password)//Match all password boxes

$(:radio)// Match all radio buttons

$(:checkbox)//Match all check boxes

$(:submit)//Match all submit buttons

$ (:image)//Match all image fields, such as

$(:reset)//Match all reset buttons

$ (:button)//Match all buttons

$(:file)//Match all file upload domains

$(:hidden)//Match all invisible elements or types For hidden elements

$(:enabled)//match all available input elements, for example radio:enabled means matching all available radio buttons

$(:disabled)//match All unavailable input elements have the opposite effect as above

$(:checked)//Match all selected check box elements

$(:selected)//Match all drop-down lists

11. Setting and removing element attributes

$("Element").attr(name) 'Get the first matching attribute value, such as $("img"). attr(“src”)

$(“Element”.attr(key,value)”) 'Set attributes for a certain element

$(“Element”.attr({key:value ,key1:value,….})) ‘Set multiple attributes for an element at once

$(“Element”).attr(key,function) ‘Set a calculated attribute for all matching elements Attribute value.

$(“Element”).removeAttr(name)//Remove an attribute