# 15: Kjetting - CSS-triks

Anonim

Vi har snakket flere ganger nå om små detaljer i jQuery API som er veldig fine. Alt er veloverveid og raffinert. Kjetting faller definitivt inn i den kategorien. Når du begynner å bruke den og forstår den, føles det ekstremt naturlig, som om det ikke skulle være noen annen måte.

Hovedideen er at du bruker flere metoder på rad på en enkelt samling av elementer.

La oss for eksempel si at når jeg har klikket på en knapp, vil jeg endre klasse samt endre tekst. Men knappen har litt HTML inni.

 Open 

Med jQuery kan vi "kjede" hele serien av handlinger sammen.

$(".button") .removeClass("open") .addClass("closed") .find(".text") .text("Closed");

Dette er mulig fordi de fleste av jQuerys metoder, selv om de brukes som en setter, returnerer et elementsett akkurat som det metoden ble kalt til. Noen ganger er det settet nøyaktig det samme, som tilfellet er med removeClassog addClassher, og noen ganger endres det settet som det er tilfellet her med find.

I eksemplet vi jobbet med i videoen snakket vi også om .end()hvilke som "rygger" ett nivå på kjeden.

$(".button") .removeClass("open") // .button .addClass("closed") // .button .find(".text") // .button .text .text("Closed") // .button .text .end(); // .button .data("thing"); // GETTER on .button

Kanskje det forklarer det bedre. Når settet med elementer endres, innrykket jeg linjen en og la merke til endringen i kommentaren. Så når vi .end()rykker ut et nivå. Dette fungerer uansett hvor mange ganger du endrer valget. Det hele slutter når du bruker en metode som returnerer noe annet enn et sett med elementer.