// Click the bullet box
$ (Document). Ready (function (){
$ ("Div"). Click (function (){
Alert ("Hello world! ");
})
})
// Add a style to the page load and click Div to remove the style.
$ (Document). Ready (function (){
$ ("Div"). addclass ("AAA ");
$ ("Div"). Click (function () {$ (this). removeclass ("AAA ")});
}
)
// When you click an element whose ID is div1, set a style for this element.
$ (Document). Ready (function (){
$ ("# Div1"). Click (function (){
Certificate (this).css ("border", "5px dashed red ");
})
});
// When you click an element whose ID is div1, set a style for the element and show the style value (5px dashed red) in a pop-up box)
$ (Document). Ready (function (){
$ ("# Div1"). Click (function (){
Certificate (this).css ("border", "5px dashed red ");
Alert(%(this%.css ("border "));
})
});
// When you click an element whose ID is div1, the style is changed.
// The border-width border-style border-color attributes must be written separately.
$ (Document). Ready (function (){
$ ("# Div1"). Click (function (){
((This).css ({color: "red", Background: "blue "});
})
});
$ (Document). Ready (function (){
$ ("# Div1"). Click (function (){
Certificate (this).css ({"border": "5px dashed red", "background-color": "blue "});
})
});
// Change the width and height of an element whose ID is div1.
$ (Document). Ready (function (){
$ ("# Div1"). Click (function (){
$ (This). Height ("100px ");
$ (This). Width ("150px ")
})
});
// Set to fade in and fade out fadeout fade out fadeto change transparency fadein fade in
// The first div1 is the trigger ID, and the second div1 is the ID of the layer to be scaled in and out.
// The onclick event is click onmouseover. The event is Mouseover.
$ (Document). Ready (function (){
$ ("# Div1"). Click (function (){
$ ("# Div1"). fadeout ("slow", function () {alert ("is this layer slowly disappearing! ")});
})
$ ("# Div2"). Mouseover (function (){
$ ("# Div2"). fadeto ("slow", 0.5, function () {alert ("is the transparency of the layer below changed to 50%! ")});
})
$ ("# Div3"). Click (function (){
$ ("# Div31"). fadein ("slow", function () {alert ("is this layer slowly emerging! ")});
})
});
// Display the sliding effect
$ (Document). Ready (function (){
$ ("# Div3"). Click (function (){
$ ("# Div2"). slideup ("normal", function () {alert ("slide hidden! ")});
$ ("# Div31"). slidedown ("normal", function () {alert ("slide display! ")});
$ ("# Div31"). slidetoggle ("normal", function () {alert ("slide hidden when displayed, slide hidden when hidden ")});
})
});
// Some attribute selectors
First, select e [@ ATTR] based on the attributes.
$ ("[@ Title]"). Click ()..........
That is, select all elements with a title attribute in the element.
<Li class = "aaaa" Title = "TTT"> li-1 </LI>
<Li Title = "fffff"> li-2 </LI>
<Div class = "aaaa" Title = "TTT"> li-1 </div>
<Div Title = "fffff"> li-2 </div>
$ ("Div [@ title]"). Click ()..........
Select all elements with title under all Div labels
<Div class = "aaaa" Title = "TTT"> li-1 </div>
<Div Title = "fffff"> li-2 </div>
Second, select e [@ ATTR = Val] based on the attribute value.
$ ("Div [@ Title = TTT]"). Click ()................
Select all the elements under the DIV whose title attribute is equal to TTT.
<Div class = "aaaa" Title = "TTT"> li-1 </div>
If it is $ ("[@ Title = TTT]"). Click ()................
All elements whose attribute title is ttt
<Li class = "aaaa" Title = "TTT"> li-1 </LI>
<Div class = "aaaa" Title = "TTT"> li-1 </div>
Third, select e [@ ATTR ^ = Val] based on the Start Letter of the attribute value.
$ ("Div [@ title ^ = T]"). Click ()................
All attribute title values under all DIV elements start with T
Third, select e [@ ATTR $ = Val] based on the Start Letter of the attribute value.
$ ("Div [@ title $ = T]"). Click ()................
All attribute title values under all DIV elements end with T
Third, select e [@ ATTR * = Val] based on the characters in the attribute.
$ ("Div [@ title * = T]"). Click ()................
All attribute title values under all DIV elements are all elements that contain t
Third, select e [@ ATTR = Val] [@ ATTR = Val] based on multiple attributes.
$ ("Div [@ Title = TTT] [@ class = AAAA]"). Click ()................
All attribute title values under all DIV elements are equal to TTT and the attribute class is equal to AAAA.
// Load usage when the single-click id_div3's element, the content of myload.html will be loaded into the layer with the ID of div31 (only loaded into the DIV, will overwrite the content of the original Div)
$ (Document). Ready (function (){
$ ("# Div3"). Click (function (){
$ ("# Div31"). Load ("myload.htm ");
})
});
$ ("Body"). Load ("test.html # A"); // load to the page
// Load usage when the single-click id_div3's element, load the content of the element whose ID is mydiv in myload.html to the layer whose ID is div31
$ (Document). Ready (function (){
$ ("# Div3"). Click (function (){
$ ("# Div31"). Load ("myload.htm # mydiv ");
})
});