Атрибути на тагови како својства во JavaScript

Ајде сега да научиме како да ги добиваме атрибутите на таговите. Овде важи следново правило: на секој атрибут на тагот одговара истоимено својство на DOM елементот.

Ајде да погледнеме на пример. Нека имаме ваков таг:

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

Да ја добиеме референцата на нашиот елемент во променлива:

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

Да ги испечатиме вредностите на атрибутите што ни се потребни:

console.log(elem.id);   // ќе испечати 'elem'
console.log(elem.type); // ќе испечати 'text'

А сега за пример да ја смениме вредноста на атрибутот:

elem.type = 'submit';

Даден е следниов инпут:

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

Дадена е и копче. При клик на копчето испечатете на екранот ја содржината на атрибутот type на горенаведениот инпут.

Даден е следниов инпут:

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

Дадена е и копче. При клик на копчето запишете во атрибутот type вредност submit.

Нека имате линк во вид на таг a, копче и параграф. При клик на копчето испечатете во параграфот ја содржината на атрибутот href на линкот.

Нека имате линк и копче. При клик на копчето додадете на крајот од текстот на линкот ја содржината на неговиот атрибут href во заградни загради.

Нека имате слика. Поставете ја на страницата со таг img. Нека се дадени и копче и параграф. Направете така што при клик на копчето во параграфот да се запише патот до сликата од нејзиниот атрибут src.

Дадена е слика во таг img и копче. При клик на копчето во атрибутот width запишете ја вредноста 300.

Дадена е слика во таг img и копче. Нека во атрибутот width е зададена одредена ширина. Направете копче, при клик на кое ширината на сликата ќе се зголемува 2 пати.

Нека имате две слики. Направете на страницата таг img и две копчиња. При клик на првото копче запишете во атрибутот src патот до првата слика, а при клик на второто - патот до втората слика.