Dit artikel beschrijft de procedure voor het ophalen van de ID van een ankerelement in een lijstitem in JavaScript.
Hoe kan ik de ID van een anker in een lijstitem in JavaScript ophalen?
Het ID-attribuut van een element is een unieke identificatie die kan worden gebruikt om dat element in een JavaScript-functie te manipuleren en te gebruiken. Gebruikers kunnen het element op verschillende manieren verkrijgen met behulp van de ID. Het kan echter lastig zijn om een ID van een HTML-element op te halen. Het kan echter een beetje ingewikkeld zijn om het ID-attribuut van een HTML-element op te halen.
Op dezelfde manier, in het geval van ankerelementen binnen een “ lijstitem ”, kan de gebruiker het ankerelement niet rechtstreeks aanroepen en de ID ervan verkrijgen, omdat er meerdere ankerelementen zullen zijn omdat deze in een lijst aanwezig zijn. Voor deze situatie laat de onderstaande demonstratie zien hoe u de ID van een ankerelement binnen een lijstitem kunt ophalen:
< html >
< lichaam >
< div >
< ul ID kaart = 'lijst' >
< Dat >
< A ID kaart = 'anker1' href = '#' > Ankerelement 1 < / A >
< / Dat >
< Dat >
< A ID kaart = 'anker2' href = '#' > Ankerelement 2 < / A >
< / Dat >
< Dat >
< A ID kaart = 'anker3' href = '#' > Ankerelement 3 < / A >
< / Dat >
< / ul >
< / div >
< P > Klik op de onderstaande knop om ID's van de ankerelementen uit de bovenstaande lijst op te halen! < / P >
< knop bij klikken = 'mijnFunctie()' > Ontvang ID's < / knop >
< P ID kaart = 'wortel' >< / P >
< script >
functie mijnFunctie() {
let listItems = document.querySelectorAll('#lijst a[id]');
voor (laat i = 0; i < lijstItems.lengte; ik++ ) {
laten ID kaart = lijstItems [ i ] . ID kaart ;
document.getElementById ( 'wortel' ) .innerHTML + =
'ID van het ankerelement' + ( ik + 1 ) + ' is: ' + ID kaart + '
';
}
}
< / script >
< / lichaam >
< / html >
De uitleg van de bovenstaande code is als volgt:
- Een ongeordende lijst met een ID “ lijst ” is gemaakt en opgenomen in “ ”-tags.
- Binnen de lijstitems worden drie ankertags aangemaakt en voorzien van ID’s “ anker1 ', ' anker2 ', En ' anker3 ”respectievelijk.
- Vervolgens wordt een “ '-element is gemaakt en bevat wat tekstinhoud.
- Vervolgens wordt een knopelement gemaakt met behulp van de “
”-tags. De ' bij klikken() ' attribuut van de knop is voorzien van een functie genaamd ' mijnFunctie() ”. - Een lege ' 'element met ID' voor ' is gecreëerd.
- Vervolgens, binnen de “
Uit de onderstaande uitvoer zijn de ankerelementen aanwezig in een lijst en kan de gebruiker zijn ID's verkrijgen door op de knop ' Ontvang ID's ' knop.
Dat gaat allemaal over het ophalen van de ID's van ankerelementen in de lijstitems.
Conclusie
Om de ID van een ankerelement in een lijstitem op te halen, gebruikt het ingebouwde JavaScript “ document.querySelectorAll() ”-methode kan worden gebruikt. Bovendien kunnen de verkregen ID’s van deze ankerelementen op de webpagina worden afgedrukt met behulp van het ingebouwde JavaScript “ .innerHTML() methode. In dit artikel wordt de procedure beschreven voor het ophalen van de ID van een ankerelement in een lijstitem in JavaScript.