First, set the element style
1. Add and remove CSS categories
$ ("div"). AddClass ("MyClass1 myClass2"); Add a class style to an element, or multiple class styles, separated by a space between each style
$ ("div"). Removeclass ("MyClass1"); Delete the class style of an element
2. Dynamic switching between categories
$ (function () {
$ ("P"). Click (Function ({
$ (this). Toggleclass ("Mycss"); The actions that are repeatedly loaded or removed from the specified style each time they are clicked, that is, the style is alternately executed.
});); This is the object that contains its function as the method is invoked: P
}); Toggleclass can only set a class that cannot be set more than one.
3, Mouse induction
$ (". D1"). mouseover (function () {mouseover: An event after the mouse has moved up
$ (this). Hide (1000); Hides the element that generated the event within 1 seconds
}); This is the object that contains its function as the method is invoked: div
$ (". D1"). mouseout (function () {mouseout: event after mouse removal
$ (this). Show (1000); Displays the element that generated the event within 1 seconds
});
$ (". D1"). Hover (function () {hover: Merges the last two events, he directly takes two functions to execute mouseover and
$ (this). Hide (1000); Mouseout the corresponding event
}, function () {hide: Hidden element
$ (this). Show (1000); Show: Display elements
});
4. Toggle Method
$ ("#btn"). Click (function () {Specify the element to be displayed alternately when the button is clicked, and the hidden action
$ (". D1"). Toggle (1000); Specifies that the element is displayed or hidden within 1 seconds
});
* * The low version of the toggle method Jquery-1.8.2.min.js can be executed normally, incompatible with the high version
$ ("#btn"). Toggle (function () {This notation directly has two functions that specify the body of the function to be executed alternately.
$ (". D1"). Slideup (); The bottom edge starts to close, and all the finished results are hidden.
}, function () {
$ (". D1"). Slidedown (); The bottom edge begins to open, and all the effects appear
});
5, whether an element contains a class class style, the return value is a Boolean type
$ ("D1"). Hasclass ("MyClass") returns True if there are myClass class styles in the D1 element, otherwise false.
JQ Third Lecture