溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

jQuery學(xué)習(xí)--------jQuery過濾器

發(fā)布時間:2020-06-12 15:02:19 來源:網(wǎng)絡(luò) 閱讀:365 作者:xiaojing___ 欄目:web開發(fā)

each() 方法規(guī)定為每個匹配元素規(guī)定運行的函數(shù)。


過濾:

下標(biāo)過濾:

    eq(index) //獲取第index個元素


類過濾:

    hasClass(class)  //檢查當(dāng)前元素是否含有某個特定的類,如果有,返回true

                       例如:$("div").hasClass("div1") //含有div1類的div元素


表達(dá)式過濾:

    filter(expr)  //篩選出與指定表達(dá)式expr匹配的元素集合,用逗號分隔多個表達(dá)式

    filter(fn)    //篩選出與指定函數(shù)fn返回值匹配的元素集合

                  例如:$("div").filter(".red")這里的表達(dá)式是指:選擇器表達(dá)式


    has(expr)  //參數(shù)expr是一個jQuery選擇器表達(dá)式字符串

                   也可以是一個元素或者一組元素

               例如:$("p").has(span.red) 選擇擁有子元素span,并且子元素類為red的p元素


判斷:表達(dá)式判斷的方法不直接過濾元素,

      僅作為一個檢測工具判斷當(dāng)前jQuery對象是否包含滿足條件的元素

    is(expr)

    例如:$("div").is(.red) //判斷是否有含有類red的div元素,如果有返回true


映射將jQuery中的每個對象映射到一個數(shù)組

      map(callback)   

      callback:給每個元素執(zhí)行的函數(shù)


清洗:從jQuery對象中刪除符合條件的元素,并返回這個清洗后的jQuery

      not(expr)


截取:截取當(dāng)前jQuery對象中的部分元素,并將部分元素裝在一個jQuery對象中返回。

      slice(start,[end])

      start表示開始選擇子集的位置,第一個元素是0,

              如果該參數(shù)為負(fù)數(shù),則表示從集合的尾部開始選起。

      end如果不指定,則表示到集合的結(jié)尾

         注意:被截取元素不包含end指定的位置


查找:

向下查找后代元素:

    DOM提供了三種方法:

       使用childNodes屬性

       使用firstChild和lastChild屬性

       使用getElementById()和getElementsByTagName()方法


    jQuery訪問后代元素:


       children()方法:查找當(dāng)前元素的所有或部分子元素

                      語法:children([expr])


       contents()方法:返回所有的子元素,還可以獲取文本節(jié)點、注釋節(jié)點

                      語法:contents();該方法沒有參數(shù)


       find()方法:查找所有的后代元素

                   語法:find(expr)

                   例子:$("body").find("p") //返回body下所有的p元素


向上查找祖先元素:

    DOM提供了parentNode屬性來訪問父元素。


    jQuery訪問父元素


       parents()方法:返回被選元素的所有祖先元素,直到根元素<html>

                      語法:parent([expr]):expr表達(dá)式過濾查詢到的祖先元素


       parent()方法:返回被選元素的直接父元素。


       parentsUntil()方法:查找指定范圍內(nèi)的父元素。

                          例子:$("span").parentsUntil("ul")//返回的父元素到ul標(biāo)簽為止。


       offsetParent()方法:返回被選元素的第一個定位父元素。


       closest()方法:查找指定的父元素

                      語法:closest(expr,[context])


向上查找兄弟元素:

    DOM提供了previousSibling屬性


    jQuery訪問向上的兄弟節(jié)點:


       prev()方法:返回上一個相鄰的元素(不包括文本節(jié)點)

                   語法:prev([expr])


       prevAll()方法:返回當(dāng)前元素以上的所有同輩元素

                      語法:prevAll([expr])


       prevUntil()方法:返回當(dāng)前元素到selector(不包含selector選擇的元素)的所有同輩元素

                       語法:prevUntil([selector])


向下查找兄弟元素:

    DOM提供nextSibling屬性


    jQuery訪問向下的兄弟節(jié)點:


       next()方法:匹配下一個相鄰的節(jié)點,不包括文本節(jié)點

                   語法:next([expr])


       nextAll()方法


       nextUntil()方法


查找兄弟元素:

    jQuery方法:

       siblings()方法:查找所以的兄弟元素。


添加查找對象:

    add()方法:向查找結(jié)果中添加新的查找內(nèi)容。

               語法:add(expr,[context])

               示例:$("div").css("border","solid 5px #000")

               .add("p")

               .css("background","#990044")


串聯(lián):

     addSelf()方法:將堆棧中的元素加入到查找結(jié)果的中

                   示例:

                          <ul>
                              <li>list item 1</li>
                              <li>list item 2</li>
                              <li class="third-item">list item 3</li>
                              <li>list item 4</li>
                              <li>list item 5</li>
                           </ul>

                       查詢代碼:  

                        $("li.third-item").nextAll().andSelf()
                                          .css("background-color", "red");

                       該代碼會設(shè)置3,4,5項的背景顏色。

                   解釋:初始的選擇器會定位項目 3,初始化的堆棧存有僅包含該項目的集合。

                             調(diào)用 .nextAll() 會將項目 4, 5 的集合推入堆棧。

                             最后,調(diào)用 .andSelf() 會合并這兩個集合。

                             所創(chuàng)建的 jQuery 對象指向按照文檔順序的所有三個項目:

                                                {[<li.third-item>,<li>,<li> ]}。


     end()方法:結(jié)束當(dāng)前鏈條中的最近的篩選操作,并將匹配元素集還原為之前的狀態(tài)

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI