Jquery淺談之講解二

來源:互聯網
上載者:User

 上次和大家討論了Jquery的基礎和簡介,列出了一些基礎的選取器,基本選取器和層次選取器,現在和大家接著討論下Jquery中的其它常用的選取器,通過學習Jquery的多種選取器,大家可能會發現Jquery是一個非常強大的html的Dom查詢庫,在Jquery中提供了非常多對於DOM查詢的方法,是我們對於Dom的操作變的異常的簡單,不用再去煩惱如果找到指定目標,現在讓我們走進Jquery選取器
                        過濾選取器:
                                 :first    $("div:first")選擇所有DIV元素中的第一個元素
                                 :last    $("div:last")選擇所有div元素的最後的一個元素
                                 :not(selector)    $("input:not(.myClass)") 擷取class不叫myClass的Input的元素
                                 :even       $("input:even")   擷取索引是偶數的Input的元素
                                  :odd       $("input:odd")    擷取索引時奇數的Input的元素
                                  :eq        $("input:eq(2)")   擷取所有input元素中下標索引為2的元素
                                  :gt         $(“input:gt(1)”)     擷取input元素中下標索引大於1的元素
                                  :lt         $("input:lt(1)")     擷取input元素中下標索引小於1的元素
                                  :header   $("header")      擷取所有的<h1>到<h6>的元素
                       內容過濾選取器
                                 :contains(text)         $("div:contains(我)")  選取文本包含”我“我的div元素
                                 :empty                    $("div:empty")    選取沒有子項目,但包括文本元素的div元素
                                 :has                       $("div:has(p)")    選取含有p元素的div元素
                                 :parent                  $("div:parent")      選取擁有子項目的div元素
                        屬性過濾選取器www.2cto.com
                                  [attribute]     $("div[id]")   返回div擁有id屬性的元素
                                  [attribute=value]   $(div[title='sharme'])     擷取屬性為title值為sharme的元素
                                  [attribute!=value]  $(div[title!='sharme'])    擷取屬性title值不為sharme的元素
                                  [attribute^='value']    $("div[title^='sha']")    擷取屬性title值為sha開頭的元素
                                  [attribute$='value']   $("div[title$='me']")    擷取屬性為title值為me結尾的div的元素
                                  [attribute*='value']    $("div[title*='sss']")    擷取屬性為title所有值為sss的div元素
                             綜合實踐:    $("div[title='sharme'][name^='sha'][class$='me']")   先後順序擷取title為sharme,name為sha開頭,class值以me結尾的div的元素
 
                                
         接下來和大家討論下對於DOM的操作,jquery中的函數
                   append()    先每一個元素內部追加內容
                   appendTo()  將內容附加到元素上      $("<div>sharme</div>").appendTo("p")   
                   prepend()       $("p").preprend("dddddddd")   將ddddd附加到p元素之前
                  prependTo()    $("ddddddd").preprendTo("p") 
                  after()
                  insertAfter()      $("<div>sharme<div/>").insertAfter("p")     將元素插入到p元素之後 
                  before();$(“p”).before(“dddd”);將ddd添加到p元素之前
                  insertBefore();//$(“dddd”).insertBefore(“p”);
 
 對於Jquery的選取器就列到這裡了,下次我將和家大討論一下Jquery中的事件處理機制,分享一下我的經驗,如果有興趣希望大家多多關注一下我的部落格,剛剛開始寫部落格,以後將會不停的更新我的部落格,將技術在這裡分享

 

摘自  sharme的專欄 

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.