Читать учебники:
HTML, CSS, JavaScript, DOM
PHP, MySQL, Apache, WordPress
Photoshop, Веб-дизайн, Flat
SEO, SMM, Landing Page

innerHTML

Свойство DOM innerHTML

Урок №5
Свойство innerHTML
innerHTML - это свойство DOM.

В этом уроке, мы рассмотрим свойство DOM — innerHTML, которое позволяет изменять или добавлять текстовую информацию в элемент.

Вспомним наш скрипт из первого урока:

document.getElementById("changeEl").style.fontSize="25px";

В конце строки кода, вместо style.fontSize="25px", разместим innerHTML="Текст изменён!"

<script>
 function getChangeEl() {
  document.getElementById("changeEl").innerHTML="Текст изменён!";
 }
</script>

<div id="changeEl">
 Изменяем текст элемента на лету, нажав на кнопку!</div>

<input type="button" value="Кнопка" onclick="getChangeEl()" />

Смотреть работу скрипта.

Вместе с текстовой информацией можно использовать и HTML-теги, пример:

document.getElementById("changeEl").innerHTML="<em>Текст</em> изменён!";

Читать далее: События DOM

Вам понравились уроки? Поддержите проект "Учебники для вебмастера"!
Можете отправить с карточки, мобильного телефона или яндекс.кошелька.
Минимальная сумма перевода 30 руб.

Категория: Статья
Статья создана: 17 Окт 2014
Статья обновлена: 5 Фев 2016

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

gabdrahimov.ru - сайт для веб-разработчиков
(c) При использовании материалов, ссылка на сайт обязательна
Автор: Габдрахимов Дамир Google
e-mail: gabdr0[at]ya.ru
разработка сайта - gabdr0
бесплатный PHP хостинг (без рекламы!) - Beget