Atributi tagova kao svojstva u JavaScriptu

Hajde sada da naučimo kako da dobijamo atribute tagova. Ovde važi sledeće pravilo: svakom atributu taga odgovara istoimeno svojstvo DOM elementa.

Pogledajmo na primeru. Neka imamo ovakav tag:

html<input id="elem" type="text">

Dobijmo referencu na naš element u promenljivu:

javascriptlet elem = document.querySelector('#elem');

Ispišimo vrednosti atributa koje su nam potrebne:

javascriptconsole.log(elem.id);   // ispisaće 'elem'
console.log(elem.type); // ispisaće 'text'

A sada za primer promenimo vrednost atributa:

javascriptelem.type = 'submit';

Задание 1

Dat je sledeći input:

html<input id="elem" type="email">

Data je takođe i dugme. Klikom na dugme ispišite na ekran sadržaj atributa type datog inputa.

Задание 2

Dat je sledeći input:

html<input id="elem" type="email">

Data je takođe i dugme. Klikom na dugme upišite u atribut type vrednost submit.

Задание 3

Neka imate link u vidu taga a, dugme i paragraf. Klikom na dugme ispišite u paragraf sadržaj atributa href linka.

Задание 4

Neka imate link i dugme. Klikom na dugme dodajte na kraj teksta linka sadržaj njegovog atributa href u oblim zagradama.

Задание 5

Neka imate sliku. Postavite je na stranicu pomoću taga img. Neka su data takođe dugme i paragraf. Uredite tako da klikom na dugme u paragraf bude upisana putanja do slike iz njenog atributa src.

Задание 6

Data je slika u tagu img i dugme. Klikom na dugme u atribut width upišite vrednost 300.

Задание 7

Data je slika u tagu img i dugme. Neka je u atributu width zadata neka širina. Napravite dugme, klikom na koje će se širina slike povećati 2 puta.

Задание 8

Neka imate dve slike. Napravite na stranici tag img i dva dugmeta. Klikom na prvo dugme upišite u atribut src putanju do prve slike, a klikom na drugo - putanju do druge slike.