Denne artikkelen inneholder prosedyren for å hente ID-en til et ankerelement i et listeelement i JavaScript.
Hvordan hente IDen til et anker inne i et listeelement i JavaScript?
ID-attributtet til et element er en unik identifikator som kan brukes til å manipulere og bruke det elementet i en JavaScript-funksjon. Brukere kan få elementet ved å bruke ID-en på forskjellige metoder. Det kan imidlertid være vanskelig å hente en ID for et HTML-element. Det kan imidlertid være litt komplisert å hente ID-attributtet til et HTML-element.
Tilsvarende, i tilfelle av ankerelementer inne i en ' listeelement ”, kan ikke brukeren ringe ankerelementet direkte og få ID-en fordi det vil være flere ankerelementer når de er til stede i en liste. For denne situasjonen viser demonstrasjonen nedenfor hvordan du henter IDen til et ankerelement i et listeelement:
< html >
< kropp >
< div >
< ul id = 'liste' >
< at >
< en id = 'anker1' href = '#' > Ankerelement 1 < / en >
< / at >
< at >
< en id = 'anker2' href = '#' > Ankerelement 2 < / en >
< / at >
< at >
< en id = 'anker3' href = '#' > Ankerelement 3 < / en >
< / at >
< / ul >
< / div >
< s > Klikk på knappen nedenfor for å få ID-er for ankerelementene fra listen ovenfor! < / s >
< knapp ved trykk = 'myFunction()' > Få ID-er < / knapp >
< s id = 'rot' >< / s >
< manus >
function myFunction() {
let listItems = document.querySelectorAll('#list a[id]');
for (la i = 0; i < listItems.length; i++ ) {
la id = listeelementer [ Jeg ] . id ;
document.getElementById ( 'rot' ) .innerHTML + =
'ID for ankerelementet' + ( jeg + 1 ) + ' er: ' + id + '
';
}
}
< / manus >
< / kropp >
< / html >
Forklaringen av koden ovenfor er som følger:
- En uordnet liste med en ID ' liste ' er opprettet og inneholdt i ' '-tagger.
- Tre ankertagger opprettes i listeelementene og er utstyrt med IDer ' anker1 ', ' anker2 ', og ' anker3 'henholdsvis.
- Deretter en ' ”-elementet er opprettet og inneholder noe tekstinnhold.
- Deretter opprettes et knappeelement ved å bruke '
'-tagger. « ved trykk() '-attributtet til knappen er utstyrt med en funksjon kalt ' myFunction() '. - En tom ' ' element med ID ' til ' er skapt.
- Deretter inne i '
Fra utgangen nedenfor er ankerelementene til stede i en liste, og brukeren kan få IDene sine ved å klikke på ' Få ID-er '-knappen.
Det handler om å hente ID-ene til ankerelementene i listeelementene.
Konklusjon
For å hente ID-en til et ankerelement inne i et listeelement, kan det innebygde JavaScript ' document.querySelectorAll() metoden kan brukes. I tillegg kan de innhentede ID-ene til disse ankerelementene skrives ut på nettsiden ved å bruke det innebygde JavaScript ' .innerHTML() 'metoden. Denne artikkelen har gitt fremgangsmåten for å hente IDen til et ankerelement i et listeelement i JavaScript.