УРОКИ JAVASCRIPT HTML DOM DHTML AJAX ПРИМЕРЫ JAVASCRIPT РЕКЛАМА

HTML DOM Свойства и Методы


« Назад Далее »

Свойства и методы определяют интерфейс программирования HTML DOM.


Интерфейс Программирования

В объектной модели документа DOM документы HTML состоят из множества узловых объектов. Доступ к узлам может осуществляться посредством JavaScript или других языков программирования. В этих уроках мы будем использовать JavaScript.

Интерфейс программирования DOM определяется стандартными свойствами и методами.

На свойства часто ссылаются как на то, с чем необходимо что-либо сделать (например, название узла).

На методы часто ссылаются как на то, что необходимо сделать (например, удалить узел).


HTML DOM Свойства

Некоторые DOM свойства:

  • x.innerHTML - текстовое значение x
  • x.nodeName - название (имя) узла x
  • x.nodeValue - значение x
  • x.parentNode - родительский узел x
  • x.childNodes - дочерние узлы x
  • x.attributes - атрибутивные узлы x

Замечание: В списке выше x является узловым объектом (HTML элементом).


HTML DOM Методы

Некоторые DOM методы:

  • x.getElementById(id) - получить элемент с указанным id
  • x.getElementsByTagName(имя) - получить все элементы с указанным названием (именем) тега
  • x.appendChild(узел) - вставить дочерний узел в x
  • x.removeChild(узел) - удалить дочерний узел из x

Замечание: В списке выше x является узловым объектом (HTML элементом).


Свойство innerHTML

Простейший способ получить или изменить содержимое элемента - использование свойства innerHTML.

innerHTML не является частью W3C спецификации DOM. Однако, оно поддерживается всеми основными браузерами.

Свойство innerHTML полезно для получения или замены содержимого HTML элементов (включая <html> и <body>), также оно может использоваться для просмотра исходного кода страницы, которая была динамически изменена.

Пример

Следующий код получает innerHTML (текст) из элемента <p> с id="intro":

Пример

<html>
<body>

<p id="intro">Привет Мир!</p>

<script type="text/javascript">
txt=document.getElementById("intro").innerHTML;
document.write("<p>Текст из параграфа intro: " + txt + "</p>");
</script>

</body>
</html>

Попробуйте сами »

В примере выше getElementById является методом, тогда как innerHTML - это свойство.


Свойства childNodes и nodeValue

Мы также можем использовать свойства childNodes и nodeValue для получения содержимого элемента.

Следующий код получает содержимое элемента <p> с id="intro":

Пример

<html>
<body>

<p id="intro">Примет Мир!</p>

<script type="text/javascript">
txt=document.getElementById("intro").childNodes[0].nodeValue;
document.write("<p>Текст из параграфа intro: " + txt + "</p>");
</script>

</body>
</html>

Попробуйте сами »

В примере выше getElementById является методом, а childNodes и nodeValue - это свойства.

В этих уроках мы в основном будем использовать свойство innerHTML. Тем не менее, рассмотрение метода выше полезно для понимания древовидной структуры DOM и обращения с XML файлами.






« Назад Далее »
© 2011-2016 Уроки JavaScript