Tässä artikkelissa kerrotaan, miten JavaScriptin luettelokohteen sisällä olevan ankkurielementin tunnus noudetaan.
Kuinka noutaa luettelokohteen sisällä olevan ankkurin tunnus JavaScriptissä?
Elementin ID-attribuutti on yksilöllinen tunniste, jota voidaan käyttää kyseisen elementin muokkaamiseen ja käyttämiseen JavaScript-funktiossa. Käyttäjät voivat saada elementin sen tunnuksella eri tavoilla. HTML-elementin tunnuksen hakeminen voi kuitenkin olla vaikeaa. HTML-elementin ID-attribuutin hakeminen voi kuitenkin olla hieman monimutkaista.
Vastaavasti ankkurielementtien tapauksessa ' luettelon kohde ”, käyttäjä ei voi kutsua suoraan ankkurielementtiä ja saada sen tunnusta, koska luettelossa on useita ankkurielementtejä. Tässä tilanteessa alla oleva esittely näyttää, kuinka luettelokohteen sisällä olevan ankkurielementin tunnus noudetaan:
< html >
< kehon >
< div >
< ul id = 'lista' >
< että >
< a id = 'ankkuri1' href = '#' > Ankkurielementti 1 < / a >
< / että >
< että >
< a id = 'ankkuri2' href = '#' > Ankkurielementti 2 < / a >
< / että >
< että >
< a id = 'ankkuri 3' href = '#' > Ankkurielementti 3 < / a >
< / että >
< / ul >
< / div >
< s > Napsauta alla olevaa painiketta saadaksesi ankkurielementtien tunnukset yllä olevasta luettelosta! < / s >
< -painiketta klikkaamalla = 'myFunction()' > Hanki henkilöllisyystodistukset < / -painiketta >
< s id = 'juuri' >< / s >
< käsikirjoitus >
function myFunction() {
let listItems = document.querySelectorAll('#list a[id]');
for (olkoon i = 0; i < listItems.length; i++ ) {
antaa id = listakohteet [ i ] . id ;
document.getElementById ( 'juuri' ) .innerHTML + =
'Ankkurielementin tunnus' + ( minä + 1 ) + ' On: ' + id + '
';
}
}
< / käsikirjoitus >
< / kehon >
< / html >
Yllä olevan koodin selitys on seuraava:
- Järjestämätön luettelo tunnuksella ' lista ' on luotu ja sisältyy ' ”tunnisteet.
- Luettelokohdissa luodaan kolme ankkuritunnistetta, jotka on varustettu tunnuksilla ' ankkuri1 ', ' ankkuri 2 ”, ja ” ankkuri 3 ' vastaavasti.
- Seuraavaksi ' ”-elementti luodaan ja sisältää jonkin verran tekstiä.
- Seuraavaksi painikeelementti luodaan käyttämällä '
”tunnisteet. ' klikkaamalla() ' painikkeen attribuutti on varustettu toiminnolla nimeltä ' myFunction() ”. - Tyhjä ' ' elementti tunnuksella ' varten ' on luotu.
- Seuraavaksi '
Alla olevasta lähdöstä ankkurielementit ovat luettelossa, ja käyttäjä voi saada tunnuksensa napsauttamalla ' Hanki henkilöllisyystodistukset ”-painiketta.
Siinä on kyse luettelon kohteiden sisältämien ankkurielementtien tunnuksien hakemisesta.
Johtopäätös
Jos haluat hakea luettelokohteen sisällä olevan ankkurielementin tunnuksen, sisäänrakennettu JavaScript ' document.querySelectorAll() ”menetelmää voidaan käyttää. Lisäksi näiden ankkurielementtien saadut tunnukset voidaan tulostaa verkkosivulle sisäänrakennetun JavaScriptin avulla. .innerHTML() ”menetelmä. Tässä artikkelissa on annettu menettely JavaScript-luettelokohteen sisällä olevan ankkurielementin tunnuksen hakemiseksi.