Latest web development tutorials
×

JavaScript курс

JavaScript курс JavaScript Краткое введение JavaScript использование JavaScript экспорт JavaScript грамматика JavaScript Заявления JavaScript примечание JavaScript переменная JavaScript Типы данных JavaScript объекты JavaScript функция JavaScript сфера JavaScript событие JavaScript строка JavaScript операторы JavaScript сравнить JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript Тип преобразования JavaScript Регулярные выражения JavaScript ошибка JavaScript отладка JavaScript Переменный лифт JavaScript Строгий режим JavaScript ненадлежащее использование JavaScript Аутентификация с помощью форм JavaScript Зарезервированные ключевые слова JavaScript JSON JavaScript void JavaScript Спецификация Код

JS функция

JavaScript определение функции JavaScript Аргументы функции JavaScript вызов функции JavaScript Затворы

JS HTML DOM

DOM Краткое введение DOM HTML DOM CSS DOM событие DOM EventListener DOM элемент

JS Расширенный учебник

JavaScript объекты JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp объекты

JS браузер BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript поп JavaScript Timed событие JavaScript Cookies

JS кладезь

JavaScript кладезь JavaScript тест jQuery JavaScript тест Prototype

JS примеров

JavaScript примеров JavaScript экземпляр объекта JavaScript экземпляр объекта Browser JavaScript HTML DOM примеров JavaScript резюме

JS справочное руководство

JavaScript объекты HTML DOM объекты

JavaScript HTML DOM

Через HTML DOM, доступ ко всем элементам JavaScript HTML документа.

HTML DOM (Document Object Model)

При загрузке страницы, браузер будет создавать объектной модели страницы документа (Document Object Model).

HTML DOM модель структурирована в виде дерева объектов:

HTML DOM дерево

DOM HTML дерево

Программируемая объектная модель, JavaScript приобрела достаточную способность создавать динамический HTML.

  • JavaScript может изменить страницу для всех элементов HTML
  • JavaScript может изменить HTML-страницы все свойства
  • JavaScript может изменить страницу все стили CSS
  • JavaScript может реагировать на все страницы событий

Обнаружение HTML-элементов

Как правило, JavaScript, необходимо манипулировать HTML-элементов.

Для того, чтобы сделать эту вещь, вы должны сначала найти элемент. Есть три способа сделать это:

  • Найти HTML элементы по ID
  • Найти HTML элементов по имени тега
  • Найти HTML элементы по имени класса

Обнаружение HTML-элементов по ID

Обнаружение HTML-элементов в DOM Самый простой способ заключается в использовании идентификатора элемента.

Этот пример находит = элемент ИД "интро":

примеров

переменная х = document.getElementById ( "интро");

Попробуйте »

Если он находит элемент, метод будет форма объекта (х в) возвращает этот элемент.

Если элемент не найден, то х будет содержать нуль.

Обнаружение HTML-элементов по имени тега

Этот пример находит ID = "основные" элементы, а затем искать "основного" элемента ID = во всех элементах <p>:

примеров

переменная х = document.getElementById ( "основной");
переменная у = x.getElementsByTagName ( "р");

Попробуйте »

Найти HTML элементы по имени класса

В этом случае поgetElementsByClassName функции , чтобы найти класс = элемент "интро":

примеров

переменная х = document.getElementsByClassName ( "интро");

Попробуйте »

HTML DOM Учебник

В этом учебнике следующие страницы, вы узнаете:

  • Как изменить содержимое HTML-элемента (innerHTML)
  • Как изменить стиль HTML-элементов (CSS)
  • Как HTML DOM событие реакции
  • Как добавлять или удалять элементы HTML