JQuery 자습 코드 --- (1)

9410 단어 jquery
/**

 * Created by wyl on 15-3-4.

 */

//Jquery   JavaScrioe ,       JavaScript  

$(document).ready(function(){

    $("p").click(function(){

        $(this).hide();

    });

});

/*

Baidu CDN:

<head>

<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">

</script>

</head>



    CDN:



<head>

<script src="http://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.2.min.js">

</script>

</head>



   CDN:

<head>

<script src="http://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js">

</script>

</head>



Google CDN:

<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">

</script>

</head>

 */

/*

jQuery   

jQuery         HTML   ,             。



    : $(selector).action()



       jQuery

   (selector)"  " "  " HTML   

jQuery   action()         

  :



$(this).hide() -       



$("p").hide() -       



$("p .test").hide() -      class="test"    



$("#test").hide() -      id="test"    

 */



//

$(document).ready(function(){

    //Jquery method go here ......

});

//

$(function(){

    //Jquery method go here ......

});



//jQuery               :$()

//Query               。

$("p");

$("h1");

$("div");



//jQuery #id       HTML     id          。

//       id       ,                    #id    。

//   id         :

$("#test");

$("#hello");

//Query             class     。

$(".test");



/*

$("*")      

$(this)     HTML   

$("p.intro")   class   intro   <p>   

$("p:first")      <p>   

$("ul li:first")      <ul>        <li>   

$("ul li:first-child")         <ul>        <li>   

$("[href]")         href          

$("a[target='_blank']")         target       "_blank"   <a>   

$("a[target!='_blank']"     target        "_blank"   <a>

$(":button")     type="button"   <input>      <button>   

$("tr:even")        <tr>       

$("tr:odd")            <tr>   

 */

//          

$(document).ready(function(){

    $("div").click(function(){

        $(this).hide();

    });

});



$(document).ready(function(){

    $("p").click(function(){

        $(this).hide();

    });

});



//          

$(document).ready(function(){

    $("div").dblclick(function(){

        $(this).hide();

    });

});



//          ,    mouseenter   。

//mouseenter()      mouseenter   ,       mouseenter         :

$(document).ready(function(){

    $("p").mouseenter(function(){

        alert("Funk you !");

    });

});

//          ,    mouseleave   。

//mouseleave()      mouseleave   ,       mouseleave         :

$(document).ready(function(){

    $("#p1").mouseleave(function(){

        alert("mouse leave");

    }) ;

});



//            ,        ,    mousedown   。

//mousedown()      mousedown   ,       mousedown         :

$(document).ready(function(){

    $(".test").mousedown(function(){

        alert("Fuck me !");

    });

});



//            ,    mouseup   。

//mouseup()      mouseup   ,       mouseup         :

$(document).ready(function(){

    $("p").mouseup(function(){

        alert("HEllo beybey!");

    });

});



//hover()            。

//          ,           (mouseenter);          ,           (mouseleave)。

$(document).ready(function(){

    $("ul").hover(function(){

        alert("You enter p1");

    }),

        function(){

            alert("Bey! you now leave p1");

        }

});



//        ,   focus   。

//               tab        ,         。

//focus()      focus   ,       focus         :

$(document).ready(function(){

    $("input").focus(function(){

        $(this).css("backgrand_color","red");

    });

    $("input").blur(function(){

        $(this).css("backgrand_color","green");

    })

});

좋은 웹페이지 즐겨찾기