2025-05-25

對於web developement,我想說說我對於Jquery知識的瞭解和總結。希望對大傢有幫助,同時也歡迎大傢的評論
      
              簡介:jquery是由美國人John Resig創建,  jquery的宗旨是:writer less,do more   對於關於jquery的其它信息可以再www.jquery.com中瞭解
   jquery是基於javascript查詢庫,  當然如果你認為它僅僅能做這種事情的話,那你也就太小看它瞭,我們通過jquery可以完成許多html的動態效果,能過輕松的進行ajax請求等
           
            歷史:jquery是 繼承prototype之後的又一個優秀的javascript框架 輕量級的js庫,擁有強大的兼容性,對於css和大部分瀏覽器都是兼容的,在頁面處理方面,jquery能過
更方便的處理html,document,events,實現動態效果,並可以提供方便的ajax交互,jquery能過很好的使得html代碼分離,從而避免在html中嵌入js的調用
 
           javacript中的五種基本數據類型:undefined,null,boolean,string,number
 
         基本的jquery用法:
                      typeOf ()   驗證關鍵字類型的返回
                      $(document).ready(function(){
                                 //這裡是jquery的基本,當html的Dom元素加載完畢,但是它們之間的相關聯關系並沒有完成時執行
                       });
                      $("a").click(function(){
                               //當html元素a被觸發click事件的時候執行
                     });
                     $("#sharmeId").click(function(){
                             //當html元素Id名為sharmeId的元素被觸發click事件的時候執行
                      });
                     //添加子元素      ,在這裡註意jquery中html()這個函數有兩個作用,沒有沒有放參數體,那麼就是獲取html()內容,如果放瞭那麼就是設置內容,這裡是設置Id為sharmeId的內容
                      $("#sharmeId").html("
                               <font color='red'>sharme Yao</font>
                        ");
                      
            選擇器的使用:
                         jquery的每一個對象都有length的屬性
                         在這裡想和大傢說說在html中onload()函數和jquery中ready()函數的區別:
                                前者表示是html中整個DOM元素都加載完畢,並且他們之間的相關聯的關系也已經完成之後執行,而後者是整個DOM元素加載完畢,但是他們之間的相關聯的關系並沒有加載完畢的時候就已經執行
 
  以下是我對於jquery中的選擇器做瞭一些篩選之後的內容,希望對於大傢使用
            基本選擇器:
                      $("#id") 根據Id找對應的元素,如果不存在返回一個空的jquery對象
                      $(".class")  更加css的class屬性找對應的元素,返回集合對象
                      $("p ")     選取所有的P標簽的元素
                      $(" * ")     找尋所有元素,返回所有元素
                     $("p,span,p")   將每一個選擇器合並在一起之後返回
         層次選擇器:
                     $("body p").css("background","red"); 將body一下的所有p元素的背景顏色改變
                     $("body > p").css("background","red");將body的直接子元素的背景顏色改變
                     $(",one+next").css(….);   將class為one的下一個元素的樣式進行操作
                     $("#one ~ p")   獲取ID為one的,後面所有的兄弟元素的集合
                     $("#one").next("p").css() ;  尋找到ID為one,下一個p元素對象
                     $("#one").nextAll("p").css();  尋找ID為one元素之後的所有p元素對象
                     $("#one").siblings("p").css()    尋找ID為one的所有的p的兄弟元素
 
         由於時間的原因,下次將和大傢更深入的瞭解選擇器和jquery的動畫,如果有哪些不好的地方希望大傢提出來,謝謝 

摘自  sharme的專欄 

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *