Курсовая работа 

По курсу: «WEB-технологии»

на тему: «Визуализация данных RDFa и разработка веб-интерфейса для управлениям ими с элементами JavaScript и технологии Ajax. Предметная область – Финансы. Библиотека JS JQuery.» 
 
 
 
 
 
 
 

Содержание

1 Введение 3

2 Обзор и сравнительная характеристика технологий и средств 3

2.1 Обзор и сравнительная характеристика XML c другими языками разметки 3

2.1.1 Сравнение XML c другими языками разметки 5

2.2 Обзор библиотеки JavaScript – jQuery 6

2.3 Обзор технологии Ajax 7

3 Основные понятия предметной области «Финансы» 9

4 Диаграмма классов предметной области «Финансы» 10

5 Словесный алгоритм работы WEB-интерфейса и описания функций. 10

6 Основные экранные формы 11

7 Листинг главной страницы 14

8 Листинг страницы с таблицей 18

9 Листинг таблицы стилей 24

10  Листинг RDF документа 27

Выводы 28

Источники информации 29

 

1 Введение

      На  сегодняшний день во всемирной паутине  полно ресурсов, на которых масса  информации. Зайдя на сайт погоды, мы легко поймём, где указана скорость ветра, где температура, а где  влажность. Читая статью, мы чётко  определяем её автора, прочитав его  имя. То есть человеческий мозг способен воспринимать информацию, анализировать  её и получать ответы на нужные вопросы, но как это понять компьютеру? Компьютер  видит только код и визуализирует  данные согласно разметке. Ему абсолютно  всё равно где имя автора, где  имя героя, где температура, и  контактная информация. С его точки  зрения всё это не более чем  просто текст, который нужно показать человеку. На было бы гораздо удобнее научить компьютер «понимать» содержимое страницы. Это позволило бы быстро найти на сайте какую-то дату, связанное с нею событие, человека, связанного с событием, его контакты и т.д. Только представьте себе, насколько полноценнее станет информационный мир с интернета с  «растолкованием» содержимого всемирной паутины! Как оказалось такая технология есть, и это RDF (Resource Description Framework — структура/каркас описания ресурсов).  А в ходе данной работы использовался RDFa, что означает RDF в атрибутах. Такой подход позволяет убить сразу двух зайцев: соединить информацию для пользователя и для компьютера. 

2 Обзор и сравнительная характеристика технологий и средств

2.1 Обзор и сравнительная характеристика XML c другими языками разметки

    Язык XML (eXtensible Markup Language - расширяемый язык разметки) был разработан консорциумом W3C (World Wide Web Consortium, www.w3c.org), который является “боссом” в области разработки и утверждения веб-стандартов. Как известно, в HTML все используемые элементы являются предопределенными, в результате чего ограничивается область применения этого языка. С течение времени, развитием технологий оказалось, что это не совсем удобно, ведь нам, возможно, потребуется теги, которых не окажется в HTML. И тогда наш “батюшка-царь” W3C представил своё новое творение - XML. В нём разработчик имеет свободу действий, так как теги создаются им “на лету” при написании кода, то есть происходит расширение языка, чего и следовало ожидать, судя по названию. А это в свою очередь означает, что при использовании XML не стоит волноваться о том, что нужных тегов не окажется, ведь их можно создать!

          XML в отличии от HTML более строгий, если при обработке HTML документа были ошибки (не закрыт тег, неправильно вложены теги, или т.д.), то браузер мог просто закрыть глаза на это и отобразить как вышло. В XML такие фокусы уже не проходят, здесь всё должно быть по правилам, а именно:

• В заголовке документа помещается объявление XML, в котором указывается язык разметки документа, номер его версии и дополнительная информация
• Каждый открывающий тэг, определяющий некоторую область данных в документе, обязательно должен быть закрыт, т.е., в отличие от HTML, нельзя опускать закрывающие тэги
• XML чувствителен к регистру, т.е., в отличие от HTML, <h1> и <H1>, не одно и тоже
• Все значения атрибутов, используемых в определении тэгов, должны быть заключены в кавычки. Обычно это двойные кавычки, но если они есть в значении атрибута, то используют одинарные
• Вложенность тэгов в XML строго контролируется, поэтому необходимо следить за порядком следования открывающих и закрывающих тэгов
• Вся информация, располагающаяся между начальным и конечными тэгами, рассматривается в XML как данные, и поэтому учитываются все символы
• Форматирования, т.е. пробелы, переводы строк, табуляции не игнорируются, в отличие от HTML

2.1.1 Сравнение  XML c другими языками разметки

    Существуют  также другие языки разметки, и  сейчас было бы уместно вспомнить  о XHTML (eXtensible Hyper Text Markup Languge — Расширяемый Гипертекстовый Язык Разметки). Этот язык служит “мостом” между XML и HTML, и основан на XML. По сути XHTML истинный XML, который понимается браузером как HTML (имеет расширение *.html), и в то же время может быть расширен разработчиком. К XHTML так же, как и к XML предъявляются серьёзные требования, которым он должен соответствовать. На сегодня это наверное самый популярный язык разметки.

    Язык  разметки MathML (Mathematical Markup Language — математический язык разметки) предназначен для представления  математических уравнений в окне браузера представления математических уравнений.  Первоначально разработали  Всемирную для того, чтобы физики-ядерщики могли обмениваться научными докладами  и документами. Однако в течение  почти десятилетия не было какого-либо способа отобразить в окнах веб-браузеров  уравнения и другие математические выражения.

    С появлением языка разметки MathML ситуация изменилась.  Используя MathML, можно  отобразить уравнения и все виды математических  выражений. Язык еще  не достаточно мощен для применения в некоторых специализированных областях науки и математики, но его возможности постоянно совершенствуются.

    Язык SVG (Scalable Vector Graphics — масштабируемая векторная графика) — это другое XML-приложение. В нем заложена неплохая идея, но она пока нашла только ограниченное применение (в основном в таких  программах, как CorelDraw, и Adobe Illustrator). Посредством SVG можно реализовать двумерную  графику, используя разметку.

    Язык  векторной разметки VML (Vector Markup Language — язык векторной разметки) —  это альтернатива SVG, разработан фирмой Microsoft. VML не обрёл такой популярности, как SVG.

    Язык  XBRL (Extensible Business Reporting Language — расширенный язык создания деловых отчетов), прежде называвшийся XFRML, — это открытая спецификация, использующая XML для описания финансовых отчетов. Используя XBRL, можно шифровать деловые финансовые отчеты для упрощения их поиска в общей массе, а также для выполнения их быстрой проверки с извлечением при этом необходимой информации.

    Язык  разметки RDF (Resource Description Framework — структура/каркас описания ресурсов) — это XML-приложение, специализирующееся на метаданных, то есть данных о других данных. Используя RDF, можно определить информацию о  таких ресурсах, как веб-страницы, фильмы, автомобили или практически  все, что угодно. Проще говоря мы видим в окне браузера какой-то текст, к примеру номер телефона и  рядом имя, и чётко понимаем, что  это номер данного человека, а  RDF позволяет “объяснить” это же браузеру, то есть описать что представляют из себя те или иные данные.

2.2 Обзор  библиотеки JavaScript – jQuery

    jQuery — библиотека JavaScript, фокусирующаяся  на взаимодействии JavaScript и HTML. Библиотека jQuery помогает легко полчать доступ к любому элементу DOM, обращаться к атрибутам и содержимому элементов DOM, манипулировать ими. Также библиотека jQuery предоставляет удобный API по работе с Ajax.

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

    Таблица 4.1 – таблица предпочтений framework’ов

 

Возможности jQuery:

• Движок кроссбраузерных CSS-селекторов Sizzle[2], выделившийся в отдельный проект;
• Переход по дереву DOM, включая поддержку XPath как плагина;
• события;
• визуальные эффекты;
• AJAX-дополнения;
• JavaScript-плагины.

2.3 Обзор  технологии Ajax

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

AJAX — не самостоятельная технология, а концепция использования нескольких смежных технологий. AJAX базируется на двух основных принципах:

• использование технологии динамического обращения к серверу «на лету», без перезагрузки всей страницы полностью, например:

• с использованием XMLHttpRequest (основной объект);
• через динамическое создание дочерних фреймов;
• через динамическое создание тега <script>.

• использованиеDHTML для динамического изменения содержания страницы;

В качестве формата  передачи данных обычно используются JSON или XML.

Преимущества

• Экономия трафика
• Уменьшение нагрузки на сервер
• Ускорение реакции интерфейса

Недостатки

• Отсутствие интеграции со стандартными инструментами браузера
• Динамически загружаемое содержимое недоступно поисковикам (если не проверять запрос, обычный он или XMLHttpRequest)
• Старые методы учёта статистики сайтов становятся неактуальными
• Усложнение проекта
• Требуется включенный JavaScript в браузере

3 Основные понятия предметной области «Финансы»

1. Деньги 
2. Налоги
3. Кредит краткосрочный
4. Кредит долгосрочный
5. Займ
6. Ссуда
7. Грант
8. Субсидия
9. Дотация
10. Дарственная
11. Банк
12. Авуары
13. Валюта
14. Рынок фондовый
15. Рынок валютный
16. Рынок срочный
17. Ценные бумаги
18. Акция
19. Вексель
20. Облигация
21. Чек
22. Налог
23. Закладная
24. Финансовые коэффициенты
25. Финансовый менеджмент

4 Диаграмма классов предметной области «Финансы»

 
 

5 Словесный алгоритм работы WEB-интерфейса и описания функций.

Пользователь  попадает на главную страницу, и с помощью меню, осуществляет навигацию по сайту. Меню выполнено в древовидной форме. На каждой новой странице пользователь узнает немного информации о конкретном понятии предметной области. В разделе «Список банков» пользователь сможет увидеть пример таблицы со списком кредитов, оформленных в каком-то городе.  Таблицу можно сортировать по определённому столбцу, как по возрастанию, так и по убыванию. Пользователь может выбрать количество строк таблицы, отображающихся за один раз, а также производить поиск по таблице.