Denne artikel beskriver proceduren til at hente ID'et for et ankerelement inde i et listeelement i JavaScript.
Hvordan henter man ID'et for et anker inde i et listeelement i JavaScript?
Et elements ID-attribut er en unik identifikator, der kan bruges til at manipulere og bruge dette element i en JavaScript-funktion. Brugere kan få elementet ved hjælp af dets ID gennem forskellige metoder. Det kan dog være svært at hente et id af et HTML-element. Det kan dog være lidt komplekst at hente ID-attributten for et HTML-element.
Tilsvarende, i tilfælde af ankerelementer inde i en ' listeelement ”, kan brugeren ikke direkte kalde ankerelementet og få dets ID, fordi der vil være flere ankerelementer, da de er til stede på en liste. Til denne situation viser nedenstående demonstration, hvordan man henter ID'et for et ankerelement inde i et listeelement:
< html >
< legeme >
< 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 > Klik på nedenstående knap for at få ID'er for ankerelementerne fra ovenstående liste! < / s >
< knap onclick = 'myFunction()' > Få ID'er < / knap >
< s id = 'rod' >< / s >
< manuskript >
function myFunction() {
let listItems = document.querySelectorAll('#list a[id]');
for (lad i = 0; i < listItems.length; i++ ) {
lade id = listeelementer [ jeg ] . id ;
document.getElementById ( 'rod' ) .innerHTML + =
'ID for ankerelementet' + ( i + 1 ) + ' er: ' + id + '
';
}
}
< / manuskript >
< / legeme >
< / html >
Forklaringen af ovenstående kode er som følger:
- En uordnet liste med et ID ' liste ' er oprettet og indeholdt i ' ” tags.
- Tre ankertags oprettes i listeelementerne og er forsynet med ID'er ' anker 1 ', ' anker 2 ', og ' anker 3 ' henholdsvis.
- Dernæst en ' ” element er oprettet og indeholder noget tekstindhold.
- Derefter oprettes et knapelement ved hjælp af '
” tags. Det ' onclick() knappens attribut er forsynet med en funktion kaldet ' myFunction() ”. - En tom ' ' element med ID ' til ” er oprettet.
- Dernæst inde i '
Fra nedenstående output er ankerelementerne til stede i en liste, og brugeren kan få deres id'er ved at klikke på ' Få ID'er ”-knappen.
Det handler om at hente ID'erne for ankerelementer inde i listeelementerne.
Konklusion
For at hente ID'et for et ankerelement inde i et listeelement skal det indbyggede JavaScript ' document.querySelectorAll() ” metode kan bruges. Derudover kan de opnåede ID'er for disse ankerelementer udskrives på websiden ved hjælp af det indbyggede JavaScript ' .innerHTML() ” metode. Denne artikel har angivet proceduren til at hente ID'et for et ankerelement inde i et listeelement i JavaScript.