jQuery Succinctly Traversing With jQuery

Skillnad mellan hitta () och filter () Metoder

De filtrera() Metoden används för att filtrera den aktuella uppsättningen av element som ingår i omslagssatsen. Dess användning bör överlåtas till uppgifter som kräver att man filtrerar en uppsättning element som redan har valts. Till exempel kommer koden nedan att filtrera de tre

element som ingår i omslagssatsen.

    

först

mitten

sista

Anmärkningar: När man använder filtrera(), fråga dig själv om det är absolut nödvändigt. Till exempel, . $ ( 'P') filter ( ': inte (: först): inte (: förra)) kan skrivas utan filtrera()$ (P: inte (: först): inte (: förra)).

De hitta() Metoden kan å andra sidan användas för att ytterligare hitta efterkommande av de för närvarande valda elementen. Tänk på hitta() mer som att uppdatera eller ändra den aktuella förpackade uppsättningen med nya element som är inkapslade inom de element som redan är markerade. Till exempel kommer koden nedan att ändra den förpackade uppsättningen från

element till två element genom att använda hitta().

    

först

mitten

sista

Anmärkningar: Du kan faktiskt kombinera elementen i omslaget innan du använder hitta() metod med de aktuella elementen genom att använda andSelf () - t.ex. $ ( 'P'). Hitta ( 'stark'). AndSelf ().

Konceptet att ta bort är det filtrera() kommer bara att minska (eller filtrera) de aktuella valda elementen i wrappuppsättningen medan hitta() kan faktiskt skapa en helt ny uppsättning inslagna element.

Anmärkningar: Både hitta() och filtrera() är destruktiva metoder som kan ångras genom att använda slutet(), som kommer att återgå till den förpackade uppsättningen tillbaka till dess tidigare tillstånd före hitta() eller filtrera() var använda.


Passerar filter () en funktion istället för en uttryck

Innan du slutar och skapar ett anpassat filter för att välja element, kan det vara mer meningsfullt att helt enkelt passera kryssrutan filtrera() Metod en funktion som låter dig granska varje element i omslagssatsen för ett visst scenario.

Låt oss till exempel säga att du vill paketera allt element i en HTML-sida med en

element som för närvarande inte är inslaget med detta element.

Du kan skapa ett anpassat filter för att utföra den här uppgiften, eller du kan använda filtrera() metod genom att ge den en funktion som bestämmer om elementets förälder är a

element, och om inte, ta sedan bort elementet från uppsättningen innan du sätter ihop element som återstår i uppsättningen med a

element.

I följande exempel väljer jag varje element på HTML-sidan, och sedan skickar jag över filtrera() Metod en funktion som används för att iterera över varje element (med detta) i omslagssatsen, och kontrollera om elementets moderelement är a

element.

      

Lägg märke till att jag använder ! operatör för att ändra ett booleskt värde från true to false. Detta beror på att jag vill ta bort element från uppsättningen som har

element som sitt moderelement. Funktionen gick vidare till filtrera() Metoden tar bara bort element från uppsättningen om funktionen returnerar false.

Huvuddelen är att om du arbetar med en isolerad situation, skapa ett anpassat filter, t.ex.. : findImgWithNoP-för en enda situation kan undvikas genom att helt enkelt överföra filtermetoden en funktion som kan göra anpassad filtrering. Detta koncept är ganska kraftfullt. Tänk på vad som är möjligt när vi använder ett regelbundet uttryckstest i samband med filtrera() metod.

    
  • jQuery är bra.
  • Det är lätt.
  • Det är gratis!
  • jQuery gör allt enkelt.

Traversing Up DOM

Du kan enkelt korsa upp DOM till förfaderelement med hjälp av förälder(), föräldrar(), och närmast() metoder. Att förstå skillnaderna mellan dessa metoder är kritisk. Undersök koden nedan och se till att du förstår skillnaderna mellan dessa jQuery-traverseringsmetoder.

    

Anmärkningar: närmast() och föräldrar() verkar ha samma funktion, men närmast() kommer faktiskt att inkludera det aktuella valda elementet vid filtreringen.
närmast()slutar korsa när den hittar en match, medan föräldrar() får alla föräldrar och sedan filtrerar på din valfria väljare. Därför, närmast() kan bara returnera högst ett element.


Traversing Methods Acceptera CSS-uttryck som valfria argument

CSS-uttryck överförs inte bara till jQuery-funktionen för att välja element, men de kan också vidarebefordras till flera av kryssningsmetoderna. Det kan vara lätt att glömma detta eftersom många av de överföringsmetoderna fungerar utan att behöva använda något uttryck alls. Nästa(). Uttrycket är valfritt för följande traversalmetoder, men kom ihåg att du har möjlighet att ge ett uttryck för filtrering.

  • barn (uttrycket ")
  • nästa ( 'expression')
  • nextAll ( 'uttrycket')
  • förälder ( 'uttrycket')
  • föräldrar ( 'uttrycket')
  • prev ( 'uttrycket')
  • prevAll ( 'uttrycket')
  • syskon ( 'uttrycket')
  • närmaste ( 'uttrycket')