# Атрибуты тегов как свойства в 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` путь к первой картинке, а по нажатию на вторую - путь ко второй картинке.

←→
↑
en ru