Построение и интерпретации HTML

Автор работы: Пользователь скрыл имя, 11 Ноября 2010 в 23:33, реферат

Описание

Гипертекстовая база данных в концепции WWW - это набор текстовых файлов, написанных на языке HTML, который определяет форму представления информации (разметка) и структуру связей этих файлов (гипертекстовые ссылки). В реальности база данных WWW гораздо более сложная вещь. В ней могут храниться и программы, написанные в соответствии со спецификацией CGI(Common Gateway Interface), и данные обычных баз данных под управлением СУБД, к которым обеспечивается доступ через программы-шлюзы, и Java-applet-ы, и графика и многое другое. Но для простоты изложения HTML можно считать, что база данных WWW - это документы, размеченные HTML.
Такой подход предполагает наличие еще одной компоненты технологии - интерпретатора языка. В World Wide Web функции интерпретатора разделены между сервером гипертекстовой базы данных и интерфейсом пользователя.

Содержание

Содержание 2

Введение 3

Принципы построения и интерпретации HTML 5

Новые возможности HTML 9

Фреймы 10

JavaScript 11

Дополнительные окна 14

Заключение 15

Библиографический список 16

Предметный указатель 17

Список иллюстраций

Рисунок 1 – Схема клиент-сервер 4

Рисунок 2 – Схема HTML документа. 6


Список таблиц

Таблица 1 – Поддержка браузерами фреймов 10

Таблица 2 - Типы инструкций, определяемые спецификацией языка 11

Работа состоит из  1 файл

Гипертекстовые документы.docx

— 93.60 Кб (Скачать документ)

<LI>, <A HREF="#list">,Создание  списка</A>,

<LI>, <A HREF="#graph">,Встроенную  графику</A>,

</UL>,

Каждая из позиций приведенного выше списка является гипертекстовой ссылкой на раздел данного  примера.

............

</BODY>, 

     Первым  Элементом тела документа является его название, которое задано заглавием первого уровня - H1. Обычно, для отображения таких заглавий используют самый крупный шрифт. Вслед за заглавием идет список примеров, который оформлен как ненумерованный список UL. Выделение элементов списка синим цветом показывает, что это гипертекстовые ссылки. которые записаны в виде тагов вида:

<A HREF="#list">,Создание  списка</A>,

Решетка перед  словом "list" означает, что это  ссылка на метку внутри документа, которая  определена как:

<A NAME="list">,

При выборе гипертекстовой ссылки происходит переход на указанную  в ссылке метку.

     Начало  нового параграфа определяется тагом <P>,. Таг конца параграфа не требуется, т.к. при вводе тага <P>, старый параграф кончается, а новый  начинается. Конец параграфа определяется и рядом других тагов. Параграф заканчивается, если начинается список например. Выделение  заглавий осуществляется тагами заглавий разного уровня. В данном примере  все разделы документа выделены как заглавия второго уровня: 

<H2>,Выделение  заголовков</H2>, 

     полезно перевести строку по месту. для этой цели и используется таг <BR>,.

     Нумерованный  список начинается с тага <OL>, и  заканчивается тагом </OL>,. От ненумерованного  он отличается тем, что перед каждым элементом списка проставляется  номер по порядку. В языке существует еще несколько видов списков.

     Встроенный  графический образ монтируется  в текст при помощи тага <IMG ...>,. Программа интерпретации языка  сначала запрашивает собственно текст документа у сервера  гипертекстовой базы данных, а за тем  по мере просмотра графические образы, которые должны быть подготовлены в  форматах GIF или JPEG. Первый формат более  предпочтителен.

     В HTML 3.0 для отображения графики, обтекаемой текстом стал применяться другой элемент - FIG. Его преимущество перед IMG заключается в том, что он разрешает  обтекание картинки текстом и  создание в тексте документа на базе графического образа стека графических  ссылок. Следует заметить, что Netscape Extensions для обтекания графики текстом  применяется контейнер IMG с атрибутом align, которому можно присвоить значения right или left. Графика в этом случае будет придвинута к соответствующему краю страницы, и текст ее будет  обтекать также как и в случае контейнера FIG.

     Однако, HTML позволяет не только отображать информацию и управлять навигацией по гипертекстовым базам данных, но создавать интерфейсы пользователя для доступа к другим программам. Для этой цели в языке предусмотрен механизм форм. Форма - это набор  полей документа, в который пользователь может вводить информацию и затем  передавать ее через сервер WWW удаленной  программе. Для описания формы в  языке зарезервированы конструкции  типа: 

<FORM METHOD=POST ACTION=http://polyn.net.kiae.su/cgi-bin/test>,

Type yourinformation here: <INPUT NAME="INPUT" VALUE="none" TYPE="text">,

Select from list:

<SELECT NAME="menu">,

<OPTION>,novice

<OPTION>,expert

<OPTION>,wizard

</SELECT>,

<HR>,

<INPUT NAME="SUBMIT" TYPE="submit" VALUE="Submit">,

</FORM>, 

     В примере данные, введенные в эту  форму будут переданы программе test(атрибут ACTION). В поле с именем INPUT можно ввести текст до 1024 символов (в старых версиях программ-интерфейсов  до 128 символов) и выбрать из меню одну из альтернатив. Поле с именем SUBMIT определяет кнопку, при нажатии  на которую данные отправляются в  сеть.

 

Новые возможности HTML

     Как уже упоминалось выше на сегодняшний  день существует два законченных  стандарта языка HTML: HTML 1.0 и HTML 2.0. Для  дальнейшего развития этого языка  было предложено несколько путей. Первый из них - это HTML+, который является базой  для следующей версии HTML - HTML 3.0. Именно в этом варианте языка были определены таблицы, стили и математические формулы. Концептуальным интерфейсом  для HTML 3.0 является программа Arena, главное  назначение которой - продемонстрировать возможности HTML 3.0. Другим направлением развития HTML стали, так называемы Netscape Extensions. Первоначально эта спецификация развивала синтаксис HTML 2.0 в сторону  более выразительных средств  представления документов (возможность  смены фона, выравнивание текста, обтекание  графики текстом и т.п.). Netscape Extensions были предложены компанией Netscape Communication и реализованы в программе Netscape Navigator версии 1.1 и старше. Фактически, если HTML+ был направлен на расширение HTML в сторону реализации публикаций научно технического характера, то Netscape Extensions развивали HTML в сторону рекламно-издательской деятельности. Это направление Netscape Communication продолжила и в следующей  версии Navigator. В Navigator 2.0 и Navigator Gold 2.0 были добавлены две принципиально  новые возможности разработки Web-страниц: фреймы и JavaScript. Заявлена также и  поддержка Java, но об этом языке как  о концептуальном развитии технологии лучше говорить в контексте другой программы - HotJava компании Sun Microsystems. Не отстает на поприще развития стандартов Web и Microsoft. В настоящее время для  пользователей Internet доступны свободнораспростроняемые сервер и интерфейс Internet Explorer. Важным здесь является тот факт, что Microsoft не просто путается поддерживать то: что  предлагают другие: но и сама предлагает новые расширения языка. Они касаются главным образом возможностей разработки мультимедийных страниц и являются в некотором смысле альтернативой  тому, что предлагают разработчики Java и JavaScript. Таким образом в настоящее  время следует выделить следующие  основные направления развития технологии Web: HTML 3.0 (HTML+), HTML 2.0 Netscape Extensions, JavaScript, Java, Microsoft Extensions.

     На  самом деле, чуть в стороне от основных направлений развития Web-технологии стоит еще одна ветвь исследований - создание трехмерных страниц, ярким  представителем которой является язык моделирования виртуальной реальности VRML, который предложен компанией Silicon, но во-первых ни один из наиболее популярных с Сети интерфейсов его  не поддерживает (загружается специальная  программа), а во-вторых работать на нем широкие массы пользователей Internet вряд ли будут - все-таки это скорее средство для профессионалов, чем  для простых пользователей. 
 
 
 
 

 

Фреймы

     Фреймы - это долгожданная многооконность, которая позволяет решить сразу множество проблем связанных с разработкой документов. В первую очередь возможность одновременной работы с текстом и меню, текстовым меню и графикой. Параллельно решаются проблема BANNER, для которой в HTML+ предлагался новый тег. Фрейм позволяет использовать часто встречающиеся фрагменты текста, например, постоянную заставку в качестве отдельного фрейма. Многие пользователи Internet наверняка встречались с этим механизмом при использовании поисковой службы InfoSeek (http://www.infoseek.com/). Если раньше нужно было постоянно вставлять в текст либо готовые части страницы, которые появляются в начале и конце каждого документа или использовать server site includes, то теперь это можно делать при помощи фреймов. Вообще, на мой взгляд, фреймы очень органичное решение, т.к. документ с фреймами является просто суперпозицией простых HTML-документов.

     Используя фрэймы, позволяющие разбивать Web-страницы на множественные скроллируемые  подокна, вы можете значительно улучшить внешний вид и функциональность информационных систем и Web-приложений. Каждое подокно, или фрэйм, может  иметь следующие свойства:

  • Каждый фрэйм имеет свой URL2, что позволяет загружать его независимо от других фрэймов
  • Каждый фрэйм имеет собственое имя (параметр name), позволяющее переходить к нему из другого фрэйма
  • Размер фрэйма может быть изменен пользователем прямо на экране при помощи мыши (если это не запрешено указанием специального параметра).

   Данные  свойства фрэймов позволяют создавать  продвинутые интерфейсные решения, такие как:

  1. Размещение статической информации, которую автор считает необходимым постоянно показывать пользователю, в одном статическом фрэйме. Это может быть графический логотип фирмы, copyright, набор управляющих кнопок
  2. Помещение в статическом фрэйме оглавления всех или части WEB-документов, содержащихся на WEB-сервере, что позволяет пользователю быстро находить интересующую его информацию
  3. Создавать окна результатов запросов, когда в одном фрэйме находится собственно запрос, а в другом результаты запроса
 
 

Таблица 1 – Поддержка браузерами фреймов

 

JavaScript

     JavaScript - это еще одно средство создания "оживших" страниц Web. Собственно, - это объектно-ориентированный язык  программирования, привязанный к  Navigator, отдельные компоненты которого  и являются объектами это языка.  Часто пишут, что Java и JavaScript - близнецы-братья. Может быть они  и братья, но отнюдь не близнецы. Во-первых для JavaScript не требуется  специального компилятора и скрипт  размещается прямо в теле документа.  Его интерпретирует непосредственно  Navigator. Конечно возможности программирования  анимации в JavaScript очень ограничены. Можно организовать бегущую строку, идущие часы, меняющиеся картинки, но не более. Главным на мой  взгляд достоинством JavaScript является  организация всего этого без  использования сервера. Navigator c JavaScript позволяет организовать многооконную  локальную гипертекстовую систему  с контекстной справочной системой, что раньше требовало достаточно  больших усилий по программирования.

     Используя JavaScript в сочетании с новыми технологиями, представленными в последних версиях браузеров, такими как объектная модель документа (Document Object Model - DOM) и каскадные таблицы стилей (Cascading Style Sheets - CSS2), можно полностью контролировать все, что происходит на вашей Web-странице. Пользуясь JavaScript и объектной моделью, вы можете создавать страницы, реагирующие на щелчки мыши и ввод информации с клавиатуры. С помощью каскадных таблиц стилей можно скрывать или показывать текст, перемещать изображения на странице, управлять размерами окна браузера и т.п.

     JavaScript-код  включается в код страницы  и исполняется интерпретатором,  встроенным в браузер. JavaScript заключается  в теги <script></script>.Скрипт, выводящий  модальное окно с классической  надписью «Hello, World!» внутри браузера:

     <script type="text/javascript">

     alert('Hello, World!');

     </script>

     В JavaScript имеется четырнадцать различных  видов инструкций, данные о которых  представлены в таблице ниже: 

Таблица 2 - Типы инструкций, определяемые спецификацией языка

Название Название        Краткие сведения
Блок Block {[<инструкции>]}
Объявление  переменной VariableStatement var <список объявления  переменных>
Пустая  инструкция EmptyStatement ;
Выражение ExpressionStatement [строка до  {{, function}] инструкция
Условие IfStatement if (<инструкция>) <выражение>[ else <выражение>]
Цикл IterationStatement do <выражение> while ( <инструкция> )

while ( <инструкция> ) <выражение> 
for ([<инструкция до начала>]; [<инструкция>] ; [<инструкция>] ) <выражение> 
for ( <объявление переменных>; [<инструкция>] ; [<инструкция>] ) <выражение> 
for ( <lvalue-выражение> in <инструкция> ) <выражение> 
for ( <объявление переменных> in <инструкция> ) <выражение>

Продолжение ContinueStatement continue [<идентификатор>]
Прерывание BreakStatement break [<идентификатор>]
Возврат ReturnStatement return [<инструкция>]
Сочетание WithStatement with ( <инструкция> ) <выражение>
Выбор SwitchStatement switch ( <инструкция> ) case <инструкция>: [<выражения>][ case <инструкция>: [<выражения>] ...] [default: [<выражения>]]
Метка LabelledStatement <идентификатор>: <выражение>
Генерация исключения ThrowStatement throw <инструкция>
Блок try TryStatement try <блок> catch ( <идентификатор> ) <блок> 
try <блок> finally <блок> 
try <блок> catch ( <идентификатор> ) <блок> finally <блок>
 
 

Общим заблуждением является то, что JavaScript аналогичен или  тесно связан с Java, это не так. Оба  языка имеют C-подобный синтаксис, являются объектно-ориентированными и как  правило широко используются в клиентских веб-приложениях, на этом их сходство заканчивается:

Java использует  парадигму ООП3 из C++; JavaScript использует прототипный подход (где нет классов, а объект — просто хеш);

Java имеет  статическую типизацию; JavaScript имеет  динамическую типизацию (значение  переменной может содержать объекты  любого типа и даже функции);

Java загружается  из скомпилированного байт-кода; JavaScript интерпретируется напрямую  из файла (но часто с незаметной JIT-компиляцией).

     На  сегодняшний день поддержку JavaScript обеспечивают современные версии всех наиболее часто  используемых браузеров. Тем не менее, иногда пользователи сталкиваются с  сообщениями, что поддержку JavaScript следует  включить для работы с тем или  иным веб-приложением. 
 
 

 

Дополнительные  окна

     Дополнительные  окна - это тесно связанный с фреймами механизм. Но если страница с фреймами делит рабочую область Navigator на несколько частей, не выходя за пределы окна программы, то в случае дополнительного окна разработчик страницы Web имеет возможность открыть новое окно Navigator и тем самым предать как бы новое измерение просмотру. Такое направление интерфейса лежит в русле разработки много оконных интерфейсов гипертекстовых систем, о которых в академических кругах говорят уже лет десять, но к единой модели такого интерфейса так до сих пор еще и не пришли. Очевидно одно, что это позволяет оставлять видимые закладки при проходе по гипертекстовой сети по инициативе разработчика страниц, что является в некоторых случаях достаточно полезным решением, которое расширяет привычную двухуровневую схему просмотра, когда в отдельное окно помещали либо графику, либо файл специального формата.

 

Заключение

В литературоведении  гипертекст — это такая форма организации текстового материала, при которой его единицы представлены не в линейной последовательности, а как система явно указанных возможных переходов, связей между ними

В рамках короткого  доклада невозможно подробно обсудить все возможности языка HTML. К настоящему времени по своим выразительным  возможностям HTML вместе со своими расширениями достиг уровня языков управления интерфейсом  локальных гипертекстовых информационных систем. Основная задача разработчиков Web-страниц состоит в том, чтобы  освоить эти возможности, и тогда  станет понятно куда можно развиваться  дальше. 

Информация о работе Построение и интерпретации HTML