JQuery leaning note1

1. $(function() {
2.             $('a').click(function() {
3.         // the methods of hiding or showing an element
4.         // in this section, you can try the following methods and see what happens
5.         // notice that the different type of parameters.
6.                 $('#box').fadeOut();
7.         $('#box').fadeOut(3000);
8.         $('#box').fadeOut('slow);
9.         $('#box').slideUp('slow');
10.         $('#box').slideUp(3000);
11.         $('#box').hide(3000);
12.         $('#box').fadeIn('slow');
13.         $('#box').slideDown('slow');
15.         // here, you can change the element's css class properties
16.         $('p a').css('color', 'blue');
17.             });
18.         });
21. $(function() {
22.             $('#box').click(function() {
23.         // Use the animate function to animate an element
24.         // you can change different properties splitted by comma
25.                 $(this).animate({
26.                     "left":"300px",
27.                     "top":"300px",
28.                     "width":"100px"
29.                 })
30.             })
31.         });
34. $(function() {
35.         // notice the different selectors
36.             $('ul li').css('color', 'red');
37.         $('ul li').addClass('alert');
38.         // select first
39.         $('ul li:first').addClass('alert');
40.             // select last
41.         $('ul li:last').addClass('alert');
42.         // select even items
43.         $('ul li:even').addClass('alert');
44.             // select odd items
45.         $('ul li:odd').addClass('alert');
47.         //this starts from the first child
48.         $('ul li:nth-child(6)').addClass('alert');
49.         // this is start from 0
50.         $('ul li:eq(5)').addClass('alert');
52.         // select items with XPATH
53.         $('ul li a[title=title]').addClass('alert');
54.         // select all the anchors under li as its children.
55.         $('ul li>a').addClass('alert');
56.         });
59. $(function() {
60.             var i = $('li').size();
61.         // add an item to ul
62.             $('a#add').click(function() {
63.                 $('<li>' + ++i + '</li>').appendTo('ul');
64.             }
65.             );
66.             // remove the last item.
67.             $('a#remove').click(function() {
68.                 $('li:last').remove();
69.             });
70.         });