jQuery common methods

Listen for events

method	meaning
Glossary: ​​selector	Selector $("p"), $("p.intro"), $("p#demo") .class #id
$(document).ready(function)	When the document is finished loading
$(selector).click(function)	Element click event
$(selector).dblclick(function)	Element double-click event
$(selector).focus(function)	Get focus event
$(selector).mouseover(function)	Mouseover event

Get content and attributes

method	meaning
$("selector").text("There are parameters for modification")	Set or return the text content of the selected element
$("selector").html("There are parameters for modification")	Sets or returns the content of the selected element (including HTML markup)
$("selector").val("There are parameters for modification")	Set or return the value of a form field
$("selector").attr("attribute value","the second parameter is modification")	Method is used to get attribute value

Insert and delete data

method	meaning
$(“selector”).append("<li>Appended item</li>");	Insert content at the end of the element (no carriage return)
$(“selector”).prepend("<li>Appended item</li>");	Insert content at the beginning of the element (no carriage return)
$(“selector”).after("<li>Appended item</li>");	Insert content after the element (with carriage return)
$(“selector”).before("<li>Appended item</li>");	Insert content before the element (with carriage return)
$(“selector”).remove();	Delete the selected element and its sub-elements (there is nothing)
$(“selector”).empty();	Delete the child elements of the selected element

Insert css style

method	meaning
$(“h1,h2,p”).addClass(“blue”);	Add one or more classes
$(“h1,h2,p”).removeClass(“blue”);	Delete one or more classes
$(“h1,h2,p”).toggleClass(“blue”);	Switch operation of adding/deleting class
$(“p”).css({“background-color”:“yellow”,“font-size”:“200%”});	Set style

Hide and show

method	meaning
Glossary: ​​speed	Speed, can take the following values: "slow", "fast" or milliseconds
Glossary: ​​callback	The name of the function executed after completion
$(selector).hide(speed,callback);	Hide data
$(selector).show(speed,callback);	Display Data
$(selector).fadeIn(speed,callback);	fade in
$(selector).fadeOut(speed,callback);	fade out
$(selector).fadeToggle(speed,callback);	fade in and fade out