Jquery學習筆記---Day02

                                                                                                        Jquery學習筆記---Day02

         一：JQuery選擇器

                 選擇器允許使用者對元素組或單個元素進行操作。

                1:JQuery元素選擇器

                例如：

                      $("p")            <!--選取<p>元素-->

                      $("p.intro")   <!--選取所有class="intro"的<p>元素-->

                      $("p#demo")<!--選取所有id="demo"的<p> 元素-->

                 2：JQuery屬性選擇器

                       JQuery使用XPath表達式來選擇帶有指定屬性的元素。

                       例如：

                           $("[href]")             <!--選取所有帶有href屬性的元素-->

                           $("[href='#']")      <!--選取所有帶有href值等于'#'的元素-->

                           $("[href!='#']")      <!--選取所有帶有href值不等于'#'的元素-->

                           $("[href$='.jpg']") <!--選取所有href值以".jpg"結尾的元素-->

                  3:Jquery CSS選擇器

                            通過JQuery CSS選擇器可以改變對應元素的CSS屬性。

                           例如--通過單擊button ，改變p元素的背景顔色為紅色

                           $(document).ready(function(){

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

                                $("p").css("background-color","red");

                               });

                            });   

                           <p>This is a pargraph</p>

                  二：JQuery事件

                          Jquery事件處理方法是jQuery中的核心函數。

                         Jquery名稱沖突解決辦法

                                     Jquery使用名為noConflict()的方法來解決該問題。

                                      var   jp=jQuery.noConflict();

                                      然後使用jp來代替$

                             JQuery常見事件

                             1：$(document),ready(function());       //将函數綁定到文檔的就緒事件，當檔案加載完成時。

                             2：$(元素).click(function());                   //單擊時觸發的事件

                             3：$(select).dbclick(function())           //滑鼠輕按兩下時觸發的事件

                             4:   $(select).focus(function())               //觸發被選元素時候的事件

                             5：$(select).mouseover(function)        //滑鼠懸靠時觸發的事件

                             6：$(select).hide()

                             7：$(select).show()

                             8：$(select).toggle()                              //實作hide和show 的切換

                            $(select).toggle(speed,callback);

                            可選的 speed 參數規定隐藏/顯示的速度，可以取以下值："slow"、"fast" 或毫秒。

                            可選的 callback 參數是隐藏或顯示完成後所執行的函數名稱。