JQuery: Overview of common methods and jquery

JQuery: Overview of common methods and jquery
Code

Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/--> Attribute:
$ ("P"). addClass (style type defined in css); add a style to an element
$ ("Img"). attr ({src: ”test.jpg ", alt:" test Image "}); add attributes/values to an element. The parameter is map.
((”Img”).attr("”src”, ”test.jpg "); add attributes/values to an element
$ ("Img"). attr ("title", function () {return this. src}); add attributes/values to an element
((" 文...html (); obtain the content (elements, text, etc.) in the element)
((" 文.".html ("<B> new stuff </B>"); set content for an element
$ ("Element name"). removeAttr ("attribute name") deletes a specified attribute and its value for an element.
$ ("Element name"). removeClass ("class") deletes a specified style for an element
$ ("Element name"). text (); get the text of this element
$ ("Element name"). text (value); set the text value of this element to value
$ ("Element name"). toggleClass (class) cancels when the element has a style in the parameter. If it does not exist, set this style.
$ ("Input element name"). val (); get the value of the input element
$ ("Input element name"). val (value); set the value of the input element to value
Manipulation:
$ ("Element name"). after (content); add content after the Matching Element
$ ("Element name"). append (content); insert content as the element content to the end of the element
$ ("Element name"). appendTo (content); element after content
$ ("Element name"). before (content); opposite to the after Method
$ ("Element name"). clone (Boolean expression) when the Boolean expression is true, the cloned element (treated as true if there is no parameter)
$ ("Element name"). empty () sets the content of this element to null
$ ("Element name"). insertAfter (content); insert the element to the content
$ ("Element name"). insertBefore (content); insert the element before the content
$ ("Element"). prepend (content); Use content as a part of the element and place it at the beginning of the element.
$ ("Element"). prependTo (content); Use this element as a part of content and put it at the beginning of content
$ ("Element"). remove (); Delete all specified elements
$ ("Element"). remove ("exp"); Delete all elements containing exp
$ ("Element"). wrap ("html"); Use html to enclose this element
$ ("Element"). wrap (element); Use element to enclose this element
Traversing:
Add (expr)
Add (html)
Add (elements)
Children (expr)
Contains (str)
End ()
Filter (expression)
Filter)
Find (expr)
Is (expr)
Next (expr)
Not (el)
Not (expr)
Not (elems)
Parent (expr)
Parents (expr)
Prev (expr)
Siblings (expr)

Core:
$ (Html). appendTo ("body") is equivalent to writing an html code in the body.
$ (Elems) gets an element in the DOM
$ (Function (){........}); Execute a function
$ ("Div> p00000000.css (" border "," 1px solid gray "); find all div subnodes p and add styles
$ ("Input: radio", document. forms [0]) Search for all radio buttons in the first form on the current page
$. Extend (prop) prop is a jquery object,
Example:
JQuery. extend ({
Min: function (a, B) {return a <B? A: B ;},
Max: function (a, B) {return a> B? A: B ;}
});
JQuery (expression, [context])-$ (expression, [context]); by default, $ () queries the DOM elements in the current HTML document.

Each (callback) executes a function using each matching element as the context.
Example: 1
$ ("Span"). click (function ){
$ ("Li"). each (function (){
$ (This). toggleClass ("example ");
});
});
Example: 2
$ ("Button"). click (function (){
$ ("Div"). each (function (index, domEle ){
// DomEle = this
((Domele).css ("backgroundColor", "yellow ");
If ($ (this). is ("# stop ")){
$ ("Span"). text ("Stopped at div index #" + index );
Return false;
}
});
});


JQuery Event:

Ready (fn); $ (document). ready () Note that there is no onload event in the body; otherwise, this function cannot be executed. You can
Many functions are loaded and executed in the fn order.
Bind (type, [data], fn) binds one or more event processor functions for a specific event that matches an element, such as click. Possible event attributes include: blur, focus, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, mousemove,
Mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress,
Keyup, error
One (type, [data], fn) binds one or more event processor functions for a specific event that matches an element, such as click. In each pair
As shown in the preceding figure, the event processing function is executed only once. Other rules are the same as those of the bind () function.

Trigger (type, [data]) triggers an event on each matching element.
TriggerHandler (type, [data]) triggers a specific event on an element (specify an event type), and cancels the default action of the browser on this event.
Unbind ([type], [data]) is unbound from each matching element.
$ ("P"). unbind () Remove all bound events on all paragraphs
$ ("P"). unbind ("click") Remove the click Event on all paragraphs
Hover (over, out) over and out are all methods. When you move the cursor over a matching element, the specified first function is triggered. When you move the cursor out of this element, the specified second function is triggered.
$ ("P"). hover (function (){
$ (This). addClass ("over ");
},
Function (){
$ (This). addClass ("out ");
}
);

Toggle (fn, fn) triggers the specified first function if a matching element is clicked. When you click the same element again, the second function is triggered.
$ ("P"). toggle (function (){
$ (This). addClass ("selected ");
},
Function (){
$ (This). removeClass ("selected ");
}
);

Element event list description
Note: For a function without parameters, the parameter is optional fn. JQuery does not support reset events of form elements.
Event Description supports elements or objects.
Blur () element loses focus a, input, textarea, button, select, label, map, area
Change () user changes the field content input, textarea, select
Click () the mouse clicks almost all elements of an object.
Dblclick () double-click almost all elements of an object
Error () an error occurs when a document or image is loaded. window, img
The focus () element obtains the focus a, input, textarea, button, select, label, map, and area.
Keydown () A keyboard key is pressed by almost all elements
Keypress () A keyboard key is pressed or pressed to almost all elements
Keyup () A keyboard key is released to almost all elements
Load (fn) a page or image is loaded. window, img
Mousedown (fn) a mouse button is pressed by almost all elements
Mousemove (fn) the mouse is moved to almost all elements
Mouseout (fn) move the mouse over an element to remove almost all elements.
Mouseover (fn) move the mouse over a certain element to almost all elements
Mouseup (fn) a mouse button is released to almost all elements
Resize (fn) window or frame size adjusted window, iframe, frame
Window when scroll (fn) is rolling the visible part of the document
Select () text selected document, input, textarea
The submit () submit button is clicked by form
Unload (fn) User exit page window

JQuery Ajax method description:

Load (url, [data], [callback]) loads a remote HTML content to a DOM node.
Upload ("#feeds”).load(”feeds.html "); load the feeds.html file into the div with the id of feeds
$ ("# Feeds"). load ("feeds. php", {limit: 25}, function (){
Alert ("The last 25 entries in the feed have been loaded ");
});

JQuery. get (url, [data], [callback]) uses GET to request a page.
$. Get ("test. cgi", {name: "John", time: "2"}, function (data ){
Alert ("Data Loaded:" + data );
});

JQuery. getJSON (url, [data], [callback]) uses GET to request JSON data.
$. GetJSON ("test. js", {name: "John", time: "2"}, function (json ){
Alert ("JSON Data:" + json. users [3]. name );
});

JQuery. getScript (url, [callback]) uses GET to request and execute javascript files.
$. GetScript ("test. js", function (){
Alert ("Script loaded and executed .");
});
JQuery. post (url, [data], [callback], [type]) uses POST to request a page.

AjaxComplete (callback) executes a function after an AJAX request is completed. This is an Ajax event
$ ("# Msg"). ajaxComplete (function (request, settings ){
$ (This). append ("<li> Request Complete. </li> ");
});
AjaxError (callback) executes a function when an AJAX request fails. This is an Ajax event
$ ("# Msg"). ajaxError (function (request, settings ){
$ (This). append ("<li> Error requesting page" + settings. url + "</li> ");
});