JavaScript. innerHTML

В прошлой статье была рассмотрена общая концепция HTML DOM объектов, и коротко был описан объект innerHTML. Тут рассмотрим больше примеров его применения.
innerHTML относится к группе объектов из HTML DOM Objects->DOM Elements, в котором хранятся объекты для работы с элементами (буд то теги или их атрибуты). Как упоминалось ранее, innerHTML объект, возвращает HTML код выбранного элемента вместе с текстом если он имеется. Также через innerHTML вносятся изменения в текст или HTML выбранного элемента. После внесения изменений через объект innerHTML, страница автоматически применяет новые атрибуты, и перезагружать страницу не нужно для того чтоб увидеть изменения.
Пример изменения атрибутов ссылки:

<a id="link_" href="ivarious.com">Link</a> // Ссылка по имени "Link" с адресом "ivarious.com"

document.getElementById("link_").innerHTML="iVARIOUS";// Изменяем имя на "iVARIOUS"
document.getElementById("link_").href="ivarious.com/contact.html";// Изменяем ссылку на "ivarious.com/contact.html" 

 

 

 

Как видно с примера, что касается изменения текста , или кода , используется innerHTML. Если изменить нужно нечто более конкретное (в примере это адрес URL), указываем название нужного атрибута. Таким образом можно изменять не только URL, но и ссылки на файлы, параметры HTML тегов и даже стили CSS.