JQuery core Functions
The former is the lookup object, the latter is the range of the former lookup
$ (argunment)
JQuery ([Selector,[context]])
Parameters
$ (Selector,[context])
Selector the string to be searched for
The element set, document, or JQuery object that the context is looking for
Eg----$ (' P ', ' [Class=two] '). CSS (' Color ', ' red ')
$ (' P ', ' [Class=one],[class=two] '). CSS (' Color ', ' red ')
Elements a DOM element for encapsulation into a JQuery object
Eg----$ (' #id ')
Object one for encapsulating into JQuery objects
Elementarray a DOM array to encapsulate as a JQuery object
jquery object one for cloning of jquery objects
jquery () returns an empty jquery object
---------------------------------
Jqueryjquery (Html,[ownerdocument])
(1.8*)
Parameters
$ (html,[ownerdocument])
HTML tag string for dynamically creating DOM elements
Ownerdocument creating a Document object where DOM elements reside
$ (Html,props)
HTML tag string for dynamically creating DOM elements
Ownerdocument properties, events, and methods that are used to attach to newly created elements
Not valid in IE:
$ ("<input>"). attr ("type", "checkbox");
Valid in IE:
$ ("<input type= ' checkbox ' >");
-----------------------------
$ ("<div>", {
"Class": "Test",
Text: "Click me!",
Click:function () {
$ (this). Toggleclass ("test");
}
}). AppendTo ("body");
-----------------------------
$ ("<input>", {
Type: "Text",
Val: "Test",
Focusin:function () {
$ (this). AddClass ("active");
},
Focusout:function () {
$ (this). Removeclass ("active");
}
}). AppendTo ("form");
-----------------------------
Callback is function
JQuery (callback)
$ (document). Ready () {
code block
}
Equivalent ↓ Shorthand
$ (function () {
code block
})
-----------------------------
Jquery.holdready (Hold)
(1.6+)
$.holdready (TRUE);
$.getscript ("Myplugin.js", function () {
$.holdready (FALSE);
});
JQuery Object Access
Each Traversal object
Index is an indexed value
Value is the object itself
function (Index)
function (Index,value)
each (callback)
<button>change colors</button>
<span></span>
<div></div>
<div></div>
<div></div>
<div></div>
<div id= "Stop" >stop here</div>
<div></div>
<div></div>
<div></div>
$ ("button"). Click (function () {
Index is indexed subscript value is the current incoming object value
$ ("div"). each (function (index, value) {
Value = = This
$ (value). CSS ("BackgroundColor", "yellow");
If this is #stop
if ($ (this). Is ("#stop")) {
$ ("span"). Text ("Stopped at Div Index #" + index);
and exits each traversal
return false;
}
});
});
----------------------------------
Size ()
Size () is the number of Get elements
$ (' div '). Size ()
----------------------------------
Length
Length is to get the lengths
var arr = [I/C, ' A ', ' B ',.. ' N ']
Arr.length;
$ (' div '). length
----------------------------------
Selector
. selector as a selector string
The results are <ul> <li> Div </li> </ul>
$ (' ul '). Append (' <li> ' + $ (' div '). Selector + ' </li> ')
$ (' ul '). Append (' <li> ' + ' div ' + ' </li> ')
----------------------------------
Context
Return Object HTMLDocument
$ (' ul ', ' div '). Context
Returns a string #document
$ (' ul ', ' div '). Context.nodename
----------------------------------
Get ([index])
Index is the indexed value, the actual DOM element, and directly operates on him, not through the JQuery function, $ (this). Get (0) and $ (this) [0] equivalent
$ (' div '). Get (0)
$ (' div ') [0]
----------------------------------
return value: Numberindex ([selector|element])
If the. Index () method does not pass arguments, the return value is the position of the first element in the collection of jquery objects relative to its sibling element
<ul>
<li id= "foo" >foo</li>
<li id= "Bar" >bar</li>
<li id= "Baz" >baz</li>
</ul>
Parameters
Index ()
Returns the index position in the sibling
$ (' #bar '). index ();
Seletor
A selector that represents a jquery object that will look up elements from this object
Element
Gets the element of the index position, which can be either a DOM element or a jQuery selector
The following are the index locations that return Li
$ (' #bar '). Index (' Li ');
$ (' li '). Index ($ (' #bar '));
$ (' li '). Index ($ (' li:gt (0) '));
$ (' li '). Index (document.getElementById (' Bar '));
Data caching
Data ([Key],[value])
Storing data on elements, returning jquery objects
If the jquery collection points to more than one element, the corresponding data is set on all elements, and the function does not create a new expando, it can store any formatted data on an element, not just the string
Parameters
Key
The stored data name.
$ (' div '). Date (' name ');
Key,value
Key: The stored data name
Value: Any data that will be stored
$ (' div '). Date (' name ', ' KK ');
Obj
A key/value pair for setting the data
$ (' div '). Date (' obj ', {' name ': ' KK ', ' sex ': ' Man '});
Data ()
----------------------------------------------
Removedata ([name|list])
Parameters
Name
The stored data name.
List
Move an array or a space-separated string
Queue control
Queue (Element,[queuename])
Display or manipulate a function queue that executes on a matching element
Parameters
Element,[queuename]
Element checks for additional queued DOM elements
QueueName string value, containing the name of the sequence, the default is FX, the standard effect sequence
Element,queuename,newqueue
Element checks for additional queued DOM elements
QueueName string value, containing the name of the sequence, the default is FX, the standard effect sequence
Newqueue An array that replaces the contents of the current function queue
Element,queuename,callback ()
Element checks for additional queued DOM elements
QueueName string value, containing the name of the sequence, the default is FX, the standard effect sequence
Callback () functions to add to the queue
<script>
$ (document.body). Click (function () {
The parameters are displayed slowly.
$ ("div"). Show ("slow");
Performs left property value +=200 on elements that are not animated, and delays 2000 milliseconds
$ ("div"). Animate ({left: ' +=200 '},2000);
Operations to join a queue function
$ ("div"). Queue (function () {
$ (this). addclass ("Newcolor");
Remove the previous join queue function and execute it
$ (this). Dequeue ();
});
Ditto
$ ("div"). Animate ({left: '-=200 '},5000);
Ditto
$ ("div"). Queue (function () {
$ (this). Removeclass ("Newcolor");
Ditto
$ (this). Dequeue ();
});
$ ("div"). Slideup ();
});
</script>
Dequeue ([QueueName])
The same as queue name defaults to FX
Remove the. Queue () created queues and execute (KK)
Remove a queue function from the front of the queue and perform his
Clearqueue ([QueueName])
Empty a queue that has not yet been executed on an object
Without parameters, the default is to empty the animation queue, which is similar to stop (true), but stop () can only empty the animation queue, which clears all queues created by. Queue ()
Plug-in mechanism
$.fn.extend (object)
Extend the JQuery element set to provide new methods (usually used to make plugins)
Parameters
Object
Used to augment JQuery objects
$.fn.extend Creating an JQ object
JQuery.fn.extend ({
Property is check example $.check
Check:function () {
Return This.each (function () {this.checked = true;});
},
Property is check example $.uncheck
Uncheck:function () {
Return This.each (function () {this.checked = false;});
}
});
$ ("Input[type=checkbox]"). Check ();
$ ("Input[type=radio]"). Uncheck ();
---------------------------------
Jquery.extend
Add function
Jquery.extend ({
Min:function (A, b) {return a < b a:b;},
Max:function (A, b) {return a > b a:b;}
});
$.min (A, B)
Docu Coexistence jquery.noconflict ([extreme])
Run this function to pass control of the variable $ to the first library that implements it.
Parameters
Excluding $ in jquery maps the referenced object back to the original object
Jquery.noconflict ();
The jquery library can only be used with jquery or
var JQ = JQuery
jquery Handbook Core function collation. doc