Home > Developer > JavaScript
// Note: The JS array starts from 0, so eq (1) is the second element.
// While the CSS selector: Nth-child () starts from 1. Therefore, to select the second element, use Nth-child (2) instead: nth-Child (1 ).
})
</SCRIPT>
2,: Odd and: Even
: Odd number of rows
: Even: even number of rows
New users often say that it seems to be the opposite of what we do?
In fact, like the eq () selector, the subscript starts from 0,
That is, the first row number of the table is 0 (even );
The number of the second row is 1 (ODD), and so on...
3, $ ("TR: odd"). addclass ()
You can write $ ("TR"). Filter (": odd"). addclass ()
4, $ ('td: Contains ("cssrain") ') // gets all TD s that contain the string cssrain
5. Convert jquery to Dom:
$ ("TD"). Get (0). tagname or $ ("TD") [0]. tagname
6. Load ():
The load () in jquery has two meanings,
The first layer can be equivalent to window. onload in Dom.
The second layer means load (URL ).
7: Ready Abbreviation:
1;
$ (Document). Ready (function (){
// Do something
})
2;
$ (). Ready (function (){
// Do something
})
3;
$ (Function (){
// Do something
})
8. Event bubbling:
normally, clicking B triggers the click of.
if we do not want to trigger a, we can use stoppropagation () to prevent bubbling.
example:
9. Hide () show () remembers the last deployment status
10, hide () show () plus time parameters
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 strict // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml" XML: lang = "ZH-CN" lang = "ZH-CN">
<SCRIPT src = "jquery. js" type = "text/JavaScript"> </SCRIPT>
<Script language = "JavaScript">
$ (Function (){
$ ('# Test'). Toggle (function (){
$ ('# A'). Hide (500); // display: None
$ ('# B'). Hide (500); // display: None
}, Function (){
$ ('# A'). Show (500); // display: inline
$ ('# B'). Show (500); // display: Block
})
})
</SCRIPT>
<Div id = "A" style = "display: inline;"> A </div>
<Div id = "B" style = "display: block;"> B </div>
<Input type = "button" id = "test" value = "test"/>
11. effect:
Show (), hide () will modify multiple style attributes at the same time: height, width, and opacity.
Fadein () fadeout (): opacity
Fadeto (): opacity
Slidedown (), slideup (): Height
If none of them are satisfied, you can only use animate ().
Animate () provides more powerful and complex effects.
12, animate ():
Previously. Show ('low'); // slow represents changing the height, width, and transparency within 0.6 seconds at the same time. If the time is 600; ===. show (600 );
Let's take a look at animate ()
Animate ({heigth: 'slow', width: 'slow'}, 'slow ')
Here, we can use the height: 'low', which is similar to. Show ('low'). Of course, it specifies the height ..
13. determine the position before performing the animation.
14, width () and CSS ('width')
15: the sequence in which the animation is executed when the animation effect is animation.
Comparison:
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 strict // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml" XML: lang = "ZH-CN" lang = "ZH-CN">
<SCRIPT src = "http://www.cssrain.cn/demo/jquerypaiapi/jquery-11_12.16.2.1.pack.js" type = "text/JavaScript"> </SCRIPT>
<Script language = "JavaScript">
$ (Function (){
$ ('# Test'). Click (function (){
$ ('# A'). animate ({left: "300px", top: "300px"}, "slow ")
})
})
</SCRIPT>
<Div id = "A" style = "position: absolute; width: 10px; Height: 10px;"> A </div>
<Input type = "button" id = "test" value = "test"/>
// The above is executed together, that is, the left and top changes together.
The difference is clear.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
