Atributele tag-urilor ca proprietăți în JavaScript
Să învățăm acum să obținem atributele tag-urilor. Aici se aplică următoarea regulă: fiecărui atribut al tag-ului îi corespunde o proprietate cu același nume a elementului DOM.
Să ne uităm la un exemplu. Să presupunem că avem următorul tag:
<input id="elem" type="text">
Să obținem o referință la elementul nostru într-o variabilă:
let elem = document.querySelector('#elem');
Să afișăm valorile atributelor de care avem nevoie:
console.log(elem.id); // va afișa 'elem'
console.log(elem.type); // va afișa 'text'
Și acum, de exemplu, să schimbăm valoarea atributului:
elem.type = 'submit';
Este dat următorul input:
<input id="elem" type="email">
De asemenea, este dat un buton. La click pe buton, afișați
pe ecran conținutul atributului type
al input-ului menționat mai sus.
Este dat următorul input:
<input id="elem" type="email">
De asemenea, este dat un buton. La click pe buton, scrieți
în atributul type valoarea submit.
Să presupunem că aveți un link sub forma tag-ului a,
un buton și un paragraf. La click pe buton, afișați
în paragraf conținutul atributului href al link-ului.
Să presupunem că aveți un link și un buton. La click
pe buton, adăugați la sfârșitul textului link-ului
conținutul atributului său href între
paranteze rotunde.
Să presupunem că aveți o imagine. Plasați-o
pe pagină folosind tag-ul img.
Să presupunem că sunt date și un buton și un paragraf. Faceți
astfel încât la click pe buton, în paragraf să se scrie
calea către imagine din atributul său src.
Este dată o imagine în tag-ul img și un buton.
La click pe buton, în atributul width
scrieți valoarea 300.
Este dată o imagine în tag-ul img și un buton.
Să presupunem că în atributul width este setată o anumită
lățime. Creați un buton, la click pe care
lățimea imaginii va crește de 2
ori.
Să presupunem că aveți două imagini. Creați pe
pagină un tag img și două butoane. La
click pe primul buton, scrieți în atributul
src calea către prima imagine, iar la click
pe al doilea - calea către a doua imagine.
