jquery Learning 02

1. jquery Action Style
1.1 using jquery to set CSS styles
1.1.1 Setting a single style
Jqueryobj.css (Name,value); Sets the property names and property values that need to be changed.
1.1.2 Setting Multiple Styles
Jqueryobj.css (obj); Obj:{name:value,name:value,...} An object consisting of key-value pairs consisting of multiple property names and property values.
1.1.3 Get Style
JQUERYOBJ.CSS (name); Gets the value of the corresponding property of the first element in a jquery object.
1.2 Using jquery to set class names
1.2.1 Adding classname
Jqueryobj.addclass (className); Appends the specified className to the object, without affecting the className that originally existed.
1.2.2 Removing classname
Jqueryobj.removeclass (ClassName); Finds and removes the specified className in the object, no effect if the specified className is not found, If classname is not specified, all classname of the object are considered to be removed.
1.2.3 Judge whether ClassName exists
Jqueryobj.hasclass (ClassName); Returns true if there is a specified className in the className of the object, or False if none is returned.
1.2.4 Switching classname
Jqueryobj.toggleclass (className); If the specified className exists in the object, the ClassName is removed, and if the specified className is not present in the object, the ClassName is appended to the object.
2. jquery Animations
2.1 Show and hide animations
Jqueryobj.show (Speed,callback), let the object display, if not passed in the parameters will be directly displayed object, no animation effect.
Jqueryobj.hide (Speed,callback), let the object hide, if not passed in the parameters will be directly hidden objects, no animation effect.
Jqueryobj.toggle (Speed,callback), toggle object display or hidden state, Hide object if object is original display state, display object if object is hidden, and animate without incoming transfer.
Speed: The time that the animation executes, callback: The callback function that executes when the animation finishes.
This set of animations changes the object's width, height, and transparency.
2.2 Fade in and fade out animations
Jqueryobj.fadein (speed,callback); Let the object fade in, without passing in the parameter will also have animation effect.
Jqueryobj.fadeout (Speed,callback), let the object fade out, do not pass in parameters will also have animation effect.
Jqueryobj.fadetoggle (speed,callback); Toggle object Fade in or fade out state, if the object is originally completely transparent then
Object fades in and fades the object if the object is not completely transparent.
Jqueryobj.fadeto (speed,to,callback); Causes the object to fade in or out to the specified transparency, speed is required, and if not, the incoming to value is considered to be the speed value.
The to parameter is the transparency of the target that needs to fade in or out.
Speed: The time that the animation executes, callback: The callback function that executes when the animation finishes.
This set of animations changes the transparency of the object.
2.3 Slide-in and slide-out animations
Jqueryobj.slidedown (Speed,callback), let the object slide in, do not pass in the parameters will also have animation effect.
Jqueryobj.slideup (Speed,callback), let the object slide out, do not pass in the parameters will also have animation effect.
Jqueryobj.slidetoggle (Speed,callback), toggle the object slide in or slide out state, slide the object in if the object's original height is 0, or slide the object out if the object's original height is not 0.
Speed: The time that the animation executes, callback: The callback function that executes when the animation finishes.
This set of animations changes the height of the object.
2.4 Custom Animations
Jqueryobj.animate (prop, speed, easing, callback); Custom change objects we want to change the properties and target values.
Prop:{name:value,name:value,...} An object consisting of key-value pairs consisting of multiple property names and property values.
Speed: The time that the animation executes, callback: The callback function that executes when the animation finishes.
Easing: The display effect when the animation is executed.
2.5 Detailed parameters
2.5.1 Speed: Two types of values can be passed in:
The specified string: Fast, slow, normal.
Number: The amount of time the animation needs to be executed, in Ms.
2.5.2 Callback: Callback function
Functions that are executed after the animation is executed can be done without.
2.5.3 easing: Animated display effect
Swing: The animation starts and ends at a slower pace, the middle part of the animation changes faster, changing speed into sinusoidal form.
Linear: Linear variation of constant speed, constant change.
2.6 Queue of animations
When registering multiple animations for an object, and the registration interval is short, all of the animated animations need to wait until the previous animation finishes to execute, which is the animation queue.
Jqueryobj.stop (clearqueue,jumptoend); stops the currently executing animation, with its two parameters representing:
Clearqueue: Clears all animations waiting to be executed in the animation queue. The passed-in parameter is a Boolean value.
Jumptoend: Whether to jump to the final effect of the current animation. The passed-in parameter is a Boolean value.
The two parameter values for stop can be set according to the specific implementation requirements.
3. jquery Operation DOM Node
3.1 Creating a DOM node
$ (HTMLSTR): Htmlstr is a string formatted as an HTML element, in the form of $ (), the HTML string is converted to a jquery object. Its return value is the object.
3.2 Adding a DOM node
3.2.1 Append ()
Jqueryobj.append (jqueryobj); Appends this parameter object to the specified parent element object, which can be either a string in HTML element format or an element obtained in the page.
Note: If the parameter is an element obtained in the page, the original page element is clipped and pasted to the specified place when appended.
Jqueryobj.append (HTMLSTR); Converts the htmlstr into a jquery object after it is added.
jquery automatically recognizes this string as a DOM element node.
Append () This method appends the parameter object to the end of all child elements of the specified object.
3.2.2 Prepend (htmlstr/jqueryobj)
The usage and attention points are exactly the same as append, and prepend () is the addition of the specified element to the front of all child elements of the current object.
3.2.3 Before (htmlstr/jqueryobj)
The usage and attention points are exactly the same as append, and before () is the addition of the specified element to the front of the current element.
3.2.4 After (htmlstr/jqueryobj)
The usage and attention points are exactly the same as append, after () is the addition of the specified element to the current element.
3.3 Replacing a DOM node
Jqueryobj.html (HTMLSTR); Replacing the contents of the current object with the specified content will automatically recognize the HTMLSTR string as a DOM element node.
3.4 Emptying the DOM node
3.4.1 jqueryobj.html (""); replaces the contents of the current object with empty content, which is not recommended, because this is only the case content, and the content corresponding to the event is still in memory.
3.4.2 Jqueryobj.empty (); empties all child elements of the current object, including the corresponding events for the child elements.
3.5 Deleting a DOM node
Jqueryobj.remove (); Deletes the current object, including all child elements of the current object and registered events.
3.6 Cloning DOM nodes
Jqueryobj.clone (flag); Clones the current object, which is deeply cloned by default and can only be deeply cloned.
The parameter flag is the event that the current object is cloned from, and the passed-in value is a Boolean type.

jquery Learning 02