Способы связывания с документом - Компьютерные сети

Внешние таблицы стилей - в отдельном css-файле. Связывается с HTML-документом командой <link rel="stylesheet" href="/templates/template. css" type="text/css" /> внутри заголовка.

Встроенные - в теге <style> в заголовке HTML-документа Inline: <tag_name style="декларация стиля "...>

Пример использования CSS

HTML:

<p class="mystyle1">текст абзаца</p>

CSS-файл:

.mystyle1 { color: red; background: yellow; font-weight: bold; }

JavaScript

Историчская справка. О появлении JavaScript. [показать]

JavaScript впервые появился в Netscape 2.0 в 1996 г. Написан Бренданом Эйчем. В этом же году Netscape передал JavaScript Европейской Ассоциации Компьютерных Производителей для стандартизации.

Программы на JavaScript встраиваются в веб-страницу и могут как угодно менят ее содержимое.

JavaScript: пример

<script language="JavaScript">

Function FirstFunction()

{ document. myForm1.myText. value ="Вы нажали первую кнопку";}

Function SecondFunction()

{ document. myForm1.myText. value ="Вы нажали вторую кнопку";}

</script>

<form name="myForm1">

<input type="text" name="myText" size=30 value="Нажмите одну из кнопок"><p>

<input type="button" name="Button1" value="Первая кнопка"

Onclick="FirstFunction(); return true;">

<input type="button" name="Button2" value="Вторая кнопка" onclick="SecondFunction(); return true;">

</form>

DOM

DOM (Document Object Model -- объектная модель документов) -- это не зависящий от платформы и языка программный интерфейс, позволяющий программам и скриптам получить доступ к элементам документа, а также изменять содержимое, структуру и оформление документа.

HTML-документ имеет иерархическую структуру, которая представлена в DOM в виде дерева, узлами которого являются теги и текст. Вложенным HTML-тегам соответствуют вложенные узлы дерева.

Модель DOM не накладывает ограничений на структуру документа. Любой документ известной структуры с помощью DOM может быть представлен в виде дерева узлов, каждый узел которого содержит элемент, атрибут, текстовый, графический или любой другой объект. Узлы связаны между собой отношениями родитель-потомок.

Изначально различные браузеры имели собственную модель DOM, не совместимую с остальными. Для того, чтобы обеспечить взаимную и обратную совместимость, специалисты международного консорциума W3C классифицировали эту модель по уровням, для каждого из которых была создана своя спецификация. Все эти спецификации объединены в общую группу, носящую название W3C DOM.

Пример.

HTML-код

Объектная модель документа

<html>

<head>

<title>ФПЖ</title>

</head>

<body>

<h1>Факультет психологии животных</h1>

<h2>О нас</h2>

<h2>Персонал</h2>

</body>

</html>

Http://it. mmcs. rsu. ru/wiki/%D0%A4%D0%B0%D0%B9%D0%BB:%D0%9E%D0%B1%D1%8A%D0%B5%D0%BA%D1%82%D0%BD%D0%B0%D1%8F_%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D1%8C_%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0.gif

Это дерево представляет собой нормализованный DOM, в котором не создаются узлы из пустого текста. Такого подхода придерживается браузер Internet Explorer. Firefox другого мнения, он создает DOM-элемент из каждого текстового фрагмента. Внутри <body>, между тегами <body> и <h1>, </h1> и <h2>, </h2> и <h2>, </h2> и </body> можно ведь помещать любой текст. Этим пустым местам соответствуют узлы дерева слева и справа от <h1> и <h2>. Opera же может добавить лишний пустой элемент просто "от щедрой души". На практике эта несовместимость не создает больших проблем, но нужно о ней помнить и делать необходимые проверки.

У каждого узла в DOM-модели есть тип. Всего в DOM различают 12 типов узлов. Его номер типа хранится в атрибуте elem. nodeType. Часто используются: Node. ELEMENT_NODE, номер которого равен 1. Узлам этого типа соответствуют HTML-тэги. Иногда полезен еще тип Node. TEXT_NODE, номер которого равен 3. Это текстовые элементы.

Любой доступ и изменения DOM происходит через объект document. Например: document. body. Свойства firstChild и lastChild показывают на первый и последний дочерние элементы и равны null, если детей нет. Свойство parentNode указывает на родителя. Например, для <body> таким элементом является <html>. Свойства previousSibling и nextSibling указывают на левого и правого братьев узла.

Некоторые из свойств элементов доступны только на чтение, другие -- на чтение и запись. Например, свойство tagName есть у элементов-тэгов, содержит имя тэга в верхнем регистре и доступно только для чтения. style -- свойство управляющее CSS-стилем, оно доступно на запись, например, можно установить element. style. width=50px. innerHTML содержит весь HTML-код внутри узла, и его можно менять. Применяется, в основном, для динамического изменения содержания страницы. onclick, onkeypress, onfocus... и другие свойства, начинающиеся на "on", хранят функции-обработчики соответствующих событий.

AJAX

AJAX (Asynchronous Javascript and XML -- асинхронный JavaScript и XML) -- подход к построению интерактивных пользовательских интерфейсов веб-приложений, заключающийся в "фоновом" обмене данными браузера с веб-сервером. В результате при обновлении данных веб-страница не перезагружается полностью, и веб-приложения становятся более быстрыми и удобными.

CMS

CMS (Content Management System) - система управления содержимым сайта. Позволяет управлять текстовым и графическим наполнением веб-сайта, предоставляя пользователю удобные инструменты хранения и публикации информации.

Похожие статьи




Способы связывания с документом - Компьютерные сети

Предыдущая | Следующая