# 5 innerHTML. Змінюємо вміст DOM елемента
Дуже часто ми стикаємося із завданням, коли нам потрібно прочитати вміст DOM елемента або змінити його. У цьому нам завжди допоможе метод innerHTML.
Давайте вирішимо таке завдання. У нас є два контейнери. Перший із якимось текстом, а другий порожній. І ми хочемо прочитати вміст першого контейнера та записати в другий контейнер.
Давайте додамо два контейнери на сторінку.
Тепер при натисканні кнопки change давайте знайдемо обидва контейнери. Для цього ми можемо використовувати функцію querySelector, яку ми вже знаємо.
Тепер давайте прочитаємо вміст першого контейнера.
Давайте напишемо console.log, щоб побачити, що ми отримали.
Якщо ми подивимося в консоль, ми побачимо наш текст, але зверніть увагу, що ми отримали абсолютно весь вміст з усіма пробілами. Зазвичай нам потрібен лише текст, тому ми можемо викликати метод trim, щоб видалити з рядка всі прогалини.
Якщо ми подивимось у браузер, то у нас виводиться рядок без пробілів.
Як же тепер записати цей контент у другий контейнер? Дуже просто. Використовуючи той же самий вінтерHTML і присвоєння.
Якщо ми подивимося в браузер, то при натисканні change вміст першого контейнера копіюється в другий контейнер. Але потрібно пам'ятати, що привласнюючи щось в innerHTML, ви перезаписуєте абсолютно весь вміст.
Давайте розглянемо складніший приклад, який часто потрібний. У нас багато однотипних елементів на сторінці і нам потрібно прочитати їхній вміст, щоб передати кудись далі.
Давайте додамо список напоїв на сторінку
Тепер ми хочемо прочитати весь список та створити масив, до якого ми запишемо всі елементи цього списку.
Отже, спочатку знайдемо всі елементи списку
Тепер додамо порожніймасив drinks, куди записуватимемо всі напої
Тепер пройдемо циклом по елементах та знайдемо контент кожного елемента
І запушимо тепер кожну знайдену назву в масив. Для цього ми можемо використовувати метод push, який додає елемент до кінця масиву.
І після циклу давайте виведемо в консоль масив. Якщо ми подивимося в браузер, то у нас вивівся наш масив елементів і ми можемо його передати будь-куди або змінити.