This article refers to teacher Ruan Yifeng’s design idea of jQuery, and some codes are also from this article, please note.

How does jQuery get elements

1. Use CSS selectors

$(document)               // Select the entire document object
$('#myId')                // Select the page element with ID myId
$('div.myClass')          // Select the div element whose class is myClass
$('input[name=first]')    // Select the input element whose name attribute is equal to first
Copy the code

2. Use jquery-specific expressions

$('a:first')           // Select the first a element in the page
$('tr:odd')            // Select the odd rows of the table
$('#myForm :input')    // Select the input element in the form
$('div:visible')       // Select the visible div element
$('div:gt(2)')         // Select all div elements except the first three
$('div:animated')      // Select the div element that is currently animated
Copy the code

How is jQuery chained

$('div').find('h3').eq(2).html('Hello')
Copy the code

How does jQuery create elements

$('<p>Hello</p>'The $()'<li class="new">new list item</li>')
Copy the code

How does jQuery move elements

$('p').insertAfter($('div'))  // Insert the p element after the div element
$('div').after($('p'))        // The p element follows the div element

$('div').insertBefore($('p')) // Place the div element before the p element
$('p').before($('div'))       The p element is preceded by the div element

$('p').appendTo($('div'))     // Add the p element from behind to the div element
$('div').append($('p'))       // Add the p element after the div element

$('p').prependTo('div')       // Add the p element from the front to the div element
$('div').prepend($('p'))      // Add the p element before the div element
Copy the code

How does jQuery modify an element’s attributes

$('div').attr('title'.'Hahaha')  // Set the title attribute of the div element to hahaha
Copy the code