/** * Created by Wyl on 15-3-4.*///jquery is a Javascrioe library that greatly simplifies JavaScript programming$ (document). Ready (function(){ $("P"). Click (function(){ $( This). Hide (); });});/*Baidu cdn:*//*jquery syntax jquery syntax is done by selecting an HTML element and performing certain actions on the selected element. Base syntax: $ (selector). Action () dollar sign definition jquery selector (selector) "Query" and "find" HTML element jquery's action () executes an instance of an operation on the element: $ (this). Hide ()- Hides the current element $ ("P"). Hide ()-Hides all paragraphs $ ("p. Test"). Hide ()-Hides all class= "test" from the paragraph $ ("#test"). Hide ()-Hides all id= "test" elements*///Document Readiness Event notation one:$ (document). Ready (function(){ //Jquery method Go here ...});//Document Readiness Event notation one:$(function(){ //Jquery method Go here ...});//all selectors in JQuery start with a dollar sign: $ ()//The Query element selector selects elements based on the element name. $ ("P");$("H1");$("Div");//The jQuery #id selector selects the specified element through the id attribute of the HTML element. //The ID of the element in the page should be unique, so you need to select a unique element in the page by #id selector. //Select the element syntax by ID as follows:$ ("#test");$("#hello");//the Query class selector can find elements through the specified class. $ (". Test");/*$ ("*") Pick all elements $ (this) pick the current HTML element $ ("P.intro") pick the <p> element of class Intro $ ("P:first") pick the first <p> element $ ("UL Li:firs T ") Select the first <ul> element of the first <li> element $ (" ul Li:first-child ") to select the first <li> element of each <ul> element $ (" [href] ") to select a The element of the href attribute on the online instance $ ("a[target= ' _blank ')" selects all the target attribute values equal to "_blank" of the <a> element $ ("a[target!= ' _blank ')" selects all target attribute values unequal <a>$ (": Button") for "_blank" selects all the <input> elements of the type= "button" and the <button> element $ ("Tr:even") to select the even position of the <tr> Element Online instance $ ("tr:odd") select the odd position of the <tr> element*///hide effect when clicked$ (document). Ready (function(){ $("Div"). Click (function(){ $( This). Hide (); });}); $ (document). Ready (function(){ $("P"). Click (function(){ $( This). Hide (); });});//Hide effect when double-click$ (document). Ready (function(){ $("Div"). DblClick (function(){ $( This). Hide (); });});//The MouseEnter event occurs when the mouse pointer passes through an element. //The MouseEnter () method triggers the MouseEnter event or specifies the function that runs when the MouseEnter event occurs:$ (document). Ready (function(){ $("P"). MouseEnter (function() {alert ("Funk you!"); });});//The MouseLeave event occurs when the mouse pointer leaves the element. //The MouseLeave () method triggers the MouseLeave event or specifies the function that runs when the MouseLeave event occurs:$ (document). Ready (function(){ $("#p1"). MouseLeave (function() {alert ("Mouse Leave"); }) ;});//The MouseDown event occurs when the mouse pointer moves over the element and the mouse button is pressed. //The MouseDown () method triggers the MouseDown event or specifies the function that runs when the MouseDown event occurs:$ (document). Ready (function(){ $(". Test"). MouseDown (function() {alert ("Fuck me!"); });});//The MouseUp event occurs when the mouse button is released on the element. //The MouseUp () method triggers the MouseUp event or specifies the function that runs when the MouseUp event occurs:$ (document). Ready (function(){ $("P"). MouseUp (function() {alert ("HEllo beybey!"); });});//The hover () method simulates a cursor hover event. //The specified first function (MouseEnter) is triggered when the mouse moves over the element, and the second function (MouseLeave) is triggered when the mouse moves out of the element. $ (document). Ready (function(){ $("ul"). Hover (function() {alert ("You enter P1"); }), function() {alert ("Bey! You now leave P1 "); }});//The focus event occurs when the element receives focus. //the element receives focus when clicked by the mouse to select an element or to navigate to an element by the TAB key. //The focus () method triggers the focus event, or specifies the function that runs when the focus event occurs:$ (document). Ready (function(){ $("Input"). Focus (function(){ $( This). CSS ("Backgrand_color", "Red"); }); $("Input"). Blur (function(){ $( This). CSS ("Backgrand_color", "green"); })});
jquery self-study Code---(i)