jQuery 的第一个例子

这是我学习jQuery的第一个例子。通过这个例子可以对jQuery的使用有个基本的认识,jQuery的事件句柄、选择器、基本语法结构。

在做第一个例子之前,你需要先到:http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.min.js&downloadBtn=%3CSPAN%3EDownload%3C%2FSPAN%3E下载 jQuery库,它是一个js的文件,非常的小,只有几十KB,下载完成后,就把这个js文件复制到你的项目,用Script附加这个文件就可以了。

 

< html xmlns = " http://www.w3.org/1999/xhtml "   >
< head id = " Head1 "  runat = " server " >
    
< title ></ title >

    
< script src = " App_Script/jquery.js "  type = " text/javascript " ></ script >

    
< style type = " text/css " >
        .red
        {
            background
- color: Red;
        }
        .green
        {
            background
- color: Green;
        }
        .blue
        {
         background
- color: Blue;
        }
    
</ style >

    
< script type = " text/javascript " >

        $(document).ready(
        function() {
            $(
" div " ).addClass( " blue " );
            
// $("#olID>li").addClass("green");

            $(
" #olID>li " ).hover(
            function() {
                $(
this ).addClass( " red " )
            },
            function() {
                $(
this ).removeClass( " red " )
            });

            $(
" #olID>li:last " ).hover(
            function() {
                $(
this ).addClass( " green " );

            },
            function() {
                $(
this ).removeClass( " green " );

            })
        })
        
    
</ script >

</ head >
< body >
    
< form id = " form1 "  runat = " server " >
    
< div >
        
< ol id = " olID " >
            
< li > Sissy.Nong.C </ li >
            
< li > 农凤新 </ li >
            
< li > [email protected] </ li >
        
</ ol >
    
</ div >
    
</ form >
</ body >
</ html >

 

 

你可能感兴趣的:(jquery)