På denna sida beskrivs man kan söka ut relaterade element från ett jQuery-objekts existerande samling av element, t.ex. föräldra- eller barnelement.
Utsökningsmetoderna på denna sida används för att hitta relaterade element, t.ex. barn-, syskon- och föräldraelement.
.each()Många av metoderna på denna sida används lämpligen i samband med metoden .each(), som loopar över alla element i jQuery-objekt. I loop görs respektive DOM-element (inte jQuery-objekt) tillgängliga genom variabeln this. Om vi vill använda elementet som ett jQuery-objekt måste vi alltså kapsla in element med koden $(this).
I exempel nedan väljs alla stycken fram, för att sen loopas över med .each(). Inuti loopen ändras stilen för bakgrundsfärg till blå.
$("p").each(function () {
$(this).css("background-color", "blue");
});När knappen Blå klickas på så anropas första raden nedan och knappen Återställ den andra raden. Bägge rader väljer fram element av klassen code, för att sen loopa över alla element. I loop anges resp. avlägsnas sen stil för bakgrundsfärg för respektive element.
$(".code").each(function () {
$(this).css("background-color", "lightblue"); //Ange stil
});$(".code").each(function () {
$(this).css("background-color", ""); //Avlagsna stil
});Till början på sida
Metoderna nedan utgår från ett existerande jQuery-objekt kan man använda selektorer från CSS för att välja ut element.
| Metod | Element som väljs ut |
|---|---|
.children([selektor]) |
Barn till alla element, och som ev. matchar selektor |
.closest(arg[, context]) |
Element som t.ex. matchar argumentet arg, med början på aktuellt element |
.find(arg) |
Ättlingar som t.ex. matchar argumentet arg |
.next([selektor]) |
Nästa syskon till alla element i nuvarande samling, och som matchar ev. selektor |
.nextAll([selektor]) |
Alla nästföljande syskon till alla element i nuvarande samling, och som matchar ev. selektor |
.nextUntil([selektor1[, selektor2]]) |
Alla nästföljande syskon till alla element i nuvarande samling, och upp till element som matchar ev. selektor1 och som matchar ev. selektor2 |
.offsetParent() |
Första förälder som är positionerad (med CSS) |
.parent([selektor]) |
Alla föräldrar till alla element i nuvarande samling, och som matchar ev. selektor |
.parents([selektor]) |
Alla förfäder till alla element i nuvarande samling, och som matchar ev. selektor |
.parentsUntil([selektor2[, selektor2]]) |
Alla föräldrar till alla element i nuvarande samling, och upp till element som matchar ev. selektor1 och som matchar ev. selektor2 |
.prev([selektor]) |
Föregående syskon till alla element i nuvarande samling, och som matchar ev. selektor |
.prevAll([selektor]) |
Alla föregående syskon till alla element i nuvarande samling, och som matchar ev. selektor |
.prevUntil([selektor1[, selektor2]]) |
Alla föregående syskon till alla element i nuvarande samling, och upp till element som matchar ev. selektor1 och som matchar ev. selektor2 |
.siblings([selektor]) |
Alla syskon till alla element i nuvarande samling, och som matchar ev. selektor |
I exempel nedan så väljs först alla tabeller (med selektorer) och sen filtreras alla barn som är tabellrader (med filtrering).
$("table").children("tr"); //Tabellers barn av typ tabellrad
Till början på sida
Nedan finns några böcker och webbsidor/-platser som jag använt för att skapa denna underwebb.