Acest articol oferă procedura pentru preluarea ID-ului unui element ancoră în interiorul unui element de listă în JavaScript.
Cum se regăsește ID-ul unei ancore în interiorul unui element de listă în JavaScript?
Atributul ID al unui element este un identificator unic care poate fi folosit pentru a manipula și utiliza acel element într-o funcție JavaScript. Utilizatorii pot obține elementul folosind ID-ul său prin diferite metode. Cu toate acestea, poate fi dificil să regăsiți un ID al unui element HTML. Cu toate acestea, poate fi puțin complex să regăsiți atributul ID al unui element HTML.
În mod similar, în cazul elementelor de ancorare în interiorul unui „ element din listă ”, utilizatorul nu poate apela direct elementul ancora și obține ID-ul acestuia, deoarece vor exista mai multe elemente ancora, deoarece acestea sunt prezente într-o listă. Pentru această situație, demonstrația oferită mai jos arată cum să preluați ID-ul unui element Anchor în interiorul unui element de listă:
< html >
< corp >
< div >
< ul id = 'listă' >
< acea >
< A id = 'ancora1' href = '#' > Elementul de ancorare 1 < / A >
< / acea >
< acea >
< A id = 'ancora2' href = '#' > Elementul de ancorare 2 < / A >
< / acea >
< acea >
< A id = 'ancora3' href = '#' > Elementul de ancorare 3 < / A >
< / acea >
< / ul >
< / div >
< p > Faceți clic pe butonul de mai jos pentru a obține ID-urile elementelor de ancorare din lista de mai sus! < / p >
< buton onclick = 'funcția mea()' > Obțineți ID-uri < / buton >
< p id = 'rădăcină' >< / p >
< scenariu >
function myFunction() {
let listItems = document.querySelectorAll('#list a[id]');
pentru (fie i = 0; i < listItems.length; i++ ) {
lăsa id = listItems [ i ] . id ;
document.getElementById ( 'rădăcină' ) .innerHTML + =
„ID-ul elementului de ancorare” + ( eu + 1 ) + ' este: ' + id + „
';
}
}
< / scenariu >
< / corp >
< / html >
Explicația codului de mai sus este următoarea:
- O listă neordonată cu un ID „ listă ” este creat și conținut în „ ' Etichete.
- Trei etichete de ancorare sunt create în elementele listei și sunt furnizate cu ID-uri „ ancora1 ', ' ancora2 ', și ' ancora3 ” respectiv.
- În continuare, un „ ” este creat și conține conținut text.
- Apoi, un element buton este creat folosind „
' Etichete. „ onclick() ” atributul butonului este prevăzut cu o funcție numită “ myFunction() ”. - Un „gol” „element cu ID” pentru ' este creat.
- În continuare, în interiorul „
Din rezultatul de mai jos, elementele de ancorare sunt prezente într-o listă, iar utilizatorul își poate obține ID-urile făcând clic pe „ Obțineți ID-uri butonul ”.
Aceasta este totul despre preluarea ID-urilor elementelor de ancorare din elementele listei.
Concluzie
Pentru a prelua ID-ul unui element ancora în interiorul unui element de listă, JavaScript încorporat „ document.querySelectorAll() ” se poate folosi metoda. În plus, ID-urile obținute ale acestor elemente de ancorare pot fi tipărite pe pagina web folosind JavaScript încorporat „ .innerHTML() ” metoda. Acest articol a furnizat procedura pentru preluarea ID-ului unui element ancoră în interiorul unui element de listă în JavaScript.