jQuery basic tutorial for operating various elements_jquery

The examples in this article describe jQuery's operations on elements, including basic operations, selecting elements to be operated on, and processing DOM elements. It has a good reference value for learning jQuery. Share it with everyone for your reference. The specific analysis is as follows:

1. Basics

jquery object set:

$(): collection of jquery objects

Get elements in jquery object set:

Get the javascript element in the wrapper using index:

var temp = $('img[alt]')[0]

Use jquery's get method to get the javascript elements in the jquery object set:

var temp = $('img[alt]').get(0)

Use jquery's eq method to get the jquery object elements in the jquery object set:

$('img[alt]').eq(0)
$('img[alt]').first()
$('img[alt]').last()

Convert jquery object set to javascript array:

var arr = $('label+button').toArray()

All button elements of the same level behind the label are converted into javascript arrays

Index of jquery object set:
var n = $('img').index($('img#id')[0]) Note: The index() parameter is a javascript element
var n = $('img').index('img#id') is equivalent to the previous line. If not found, returns -1
var n = $('img').index() gets the index of img in the same level element

Add more jquery object sets to the jquery object set:
Use commas:

$('img[alt],img[title]')

Use add method:

$('img[alt]').add('img[title]')

Take different methods for different jquery objects:

$('img[alt]').addClass('thickBorder').add('img[title]').addClass('');

Add newly created element to jquery object set:

$('p').add('<div></div>');

Delete elements from jquery object set:

$('img[title]').not('[title*=pu]')
$('img').not(function(){return !$(this).hasClass('someClassname')})

Filter jquery object set:
$('td').filter(function(){return this.innerHTML.match(^d $)}) filters td

containing numbers

Get a subset of jquery object set

$('*').slice(0,4) A new set of jquery objects containing the first 4 elements
$('*').slice(4) A new set of jquery objects containing the first 4 elements
$('div').has('img[alt]')

Convert elements in jquery object set:

var allIds = $('div').map(function(){
 return (this.id==undefined) ? null : this.id;
}).get();

The above example can be converted into a javascript array through the get method.

Traverse the elements in the jquery object set:

$('img').each(function(n){
 this.alt = '这是第['+n+']张图片，图片的id是' + this.id;
})
$([1,2,3]).each(function(){alert(this);})

Get a set of jquery objects using relationships between elements:

$(this).closest('div') For example, in which div the triggered button occurs
$(this).siblings('button[title="Close"]')All sibling elements, excluding itself
$(this).children('.someclassname')All child node elements, excluding duplicate child nodes
$(this).closest('') is close to the ancestor element
$(this).contents() is a set of jquery objects composed of element contents. For example, you can get the