Атрибути на таговете като свойства в 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 пътя към първото изображение, а при натискане на втория - пътя към второто изображение.