Hvordan bla til ID i JavaScript?

Hvordan bla til ID i JavaScript?

Nettstedene eller websidene gir ofte funksjonaliteten for å omdirigere deg til den spesifiserte delen. For eksempel å få tilgang til relevant sideinnhold som svar på søket fra brukerens slutt. Denne funksjonaliteten er vanligvis tydelig på de forskningsbaserte nettstedene der innholdet er for langvarig til å gå gjennom. Tatt i betraktning dette er det veldig nyttig å spare brukerens tid og få tilgang til det relaterte innholdet øyeblikkelig å bla til ID i JavaScript.

Denne bloggen vil forklare metodene for å bla til ID i JavaScript.

Hvordan bla til ID i JavaScript?

For å bla til ID i JavaScript, kan følgende metoder brukes:

  • ScrollIntoview ()”Metode.
  • ScrollIntoview ()”Metode med en“ved trykk" Begivenhet.
  • Scrollto ()”Metode og dens attributter.

Følgende tilnærminger vil demonstrere det uttalte konseptet en etter en!

Metode 1: Bla til ID i JavaScript ved hjelp av ScrollIntoview () -metode

Denne metoden kan implementeres for å få tilgang til et bestemt avsnitt via IDen og bla rett til den.

Følgende eksempel illustrerer det uttalte konseptet.

Eksempel

For det første, ta med overskriften i "

Python

Også tilordne den spesifiserte "id”Til følgende avsnitt for å bli rullet:

Python er et veldig godt språk å starte med programmering. Dette inkluderer liste, sublister, matriser, looping, funksjoner, variabler og mye mer. Det inkluderer også forskjellige biblioteker og pakker å integrere med forskjellige innebygde funksjonaliteter og utføre oppgaver.

Tilsvarende, gjenta trinnene ovenfor for å inkludere henholdsvis følgende overskrift og avsnitt:

JavaScript


JavaScript er et skriptspråk som hjelper mye på å designe forskjellige interaktive websider. Det kan integreres med HTML for å bruke noen ekstra funksjoner også. På denne måten tiltrekker den også sluttbrukeren.

Etter det, spesifiser følgende bilde og juster dimensjonene:



Bruk også “href”Attributt sammen med“”Tag For å få tilgang til den spesifiserte funksjonen:

Bla til avsnitt

Til slutt, erklære funksjonen som heter “Scrolltoid ()”Å få tilgang til for rulling. I funksjonsdefinisjonen får du tilgang til avsnitts -IDen ved å bruke "dokument.getElementById ()”Metode og bruk“ScrollIntoview ()”Metode på den tilgjengelige IDen. Dette vil resultere i å bla til DOM til tilsvarende avsnitt:

FunksjonscrollToid ()
var tilgang = dokument.getElementById ("para");
adgang.ScrollIntoview (atferd: 'glatt', sant);

Den resulterende utgangen vil være:

Metode 2: Bla til ID i JavaScript ved hjelp av ScrollIntoview () -metode med en OnClick -hendelse

Disse metodene kan brukes i kombinasjon for å hente IDen til et bestemt bilde og bla til det på knappeklikk.

Eksempel

I følgende eksempel, spesifiser følgende overskrift:

Klikk på knappen for å bla til elementet.

Deretter oppretter du den spesifiserte knappen sammen med en "ved trykk”Hendelse som påkaller funksjonen ScrollToid ():



Inkluder nå følgende bilder med de spesifiserte ID -ene og justerte dimensjoner:


Til slutt, definere funksjonen som heter “Scrolltoid ()”. Her får du tilgang til den tildelte IDen til et av bildene og bla til den ved hjelp av “ScrollIntoview ()”Metode:

FunksjonscrollToid ()
var tilgang = dokument.getElementById ("Id2");
adgang.ScrollIntoview ();

Produksjon

Metode 3: Bla til ID i JavaScript ved hjelp av ScrollTo () -metode og dens attributter

Scrollto ()”Metode ruller dokumentet til spesifiserte koordinater. Denne metoden kan brukes for å bla til det spesifiserte bildet ved å bruke metodens attributter.

Syntaks

vindu.Scrollto (x, y)

I den gitte syntaksen, “x”Og“y”Angi de horisontale og vertikale koordinatene representert i henholdsvis piksler. I det undergitte eksemplet er begge tildelt som "955

For å tømme konseptet, gå gjennom følgende eksempel.

Eksempel

Inkluder først det spesifiserte bildet i det spesifiserte “div”Element og juster dimensjonene:



Tilsvarende, gjenta prosedyren ovenfor med følgende bilde:



Deretter bruker du “href”Attributt, få tilgang til den spesifiserte funksjonen i“anker (a)" stikkord:

Bla til bilde



Sist, definer funksjonen som heter “Scrolltoid ()”. Her kan du hente den spesifiserte IDen som tilsvarer et av de inkluderte bildene. Bruk også “Scrollto ()”Metode sammen med attributtene (ScrollTop, Scrollleft) ved å referere til IDen til det hentet bildet. Dette vil resultere i å rulle DOM til bildet mot den hentet ID:

FunksjonscrollToid ()
var tilgang = dokument.getElementById ("IMG1");
vindu.Scrollto (
Topp: tilgang.rulle,
Venstre: tilgang.Scrollleft);

Produksjon

Vi har samlet forskjellige metoder for å bla til ID i JavaScript.

Konklusjon

For å bla til ID i JavaScript, bruk "Scrolintoview ()”Metode for å få tilgang til den spesifiserte IDen til avsnittet og bla til den,“Scrolintoview ()”Metode med en“ved trykk”Hendelse for å bla til det tilgjengelige bildet på knappeklikket eller“Scrollto ()”Metode og dens attributter til å bla til det tilgjengelige bildet ved å justere attributtene til den anvendte metoden. Denne bloggen demonstrerte metodene for å bla til ID i JavaScript.