1-2-3 AJAX+DOM+JSON = Web-разботка становится интереснеера

Web-разработчики привыкли, что сценарии JavaScript в web-обозревателе
перегружаются вместе с HTML-документом. А перегрузка происходит
при путешествии по содержимому какого-либо сайта.
Таким образом: объекты, функции, переменные имели такое же время жизни,
как и отображаемый документ. Это делало работу сценариев JavaScript
похожими на сценарии серверной стороны, таких как PHP, Python, Perl.
Правда объекты, функции, переменные вообще живут только во время
исполнения сценария на сервере. А клиентский JavaScript пока отображается
страница способен на "диалог" с пользователем, например, обеспечивает
какой-нибудь визуальный эффект или проверяет поля формы.

1) Применение AJAX, как известно, позволяет делать
запросы к серверу без берегрузки документа, т.е. подкачивать данные.
В этом случае объекты JavaScript могут "жить" до тех пор
пока не будет закрыто окно браузера. Это делает web-страницу
больше похожим на настоящее приложение опереционной системы.
Их так и стали называть - web-приложения.
Иметь постоянно существующие объекты JavaScript на стороне
делает web-разработку гораздо интереснее и, даже, как-то серъезнее (IMG:style_emoticons/default/smile.gif) .

Современные браузеры имеют развитую объектную модель
документа(DOM), позволяющую легко манипулировать содержимым
документа. А формат представления данных JSON обеспечивает
легкий обмен структуированной информацией между клиентом и сервером.

Пример:


I Этап
На клиенскую часть загружается:
1. Объект обеспечивающий коммуникацию(AJAX)
2. Объект умеющий преобразовывать данные в отображаемый HTML
и собирать данные из HTML в JSON

II Этап
1. Дается запрос на получение данных(JSON)
2. Объект-разборщик преобразует JSON в HTML ипользуя
методы DOM(например createElement, createTextNode, appendChild)

||| Этап
После того, как были произведены какие-либо изменения
в отображаемой информации:
1. Производится сборка данных из HTML
и упаковывается в JSON
2. JSON отсылается на сервер

Замечание.
С сервера можно присылать не только какую-нибудь структуру данных,
но и целый объект(без методов конечно). Тогда после манипуляций
с аттрибутами этого объекта его можно отослать на сервер
где его состояние будет сохранено в БД.

Пример техники AJAX+DOM+JSON.

Обзор.
Данная техника использует формат представления
данных JSON, AJAX для доставки данных и
методы DOM при отображении даннх клиенту.

Как это делается.

1) Создается экземпляр объекта-конструктора ajax и с помощью него
посылается запрос на сервер за JSON-данными(файл "menu.js").

2) После загрузки JSON вызывается функция onJsonLoad,
которая преобразует JSON-текст в объект и используя методы
DOM производит отображение данных согласно заданным правилам.

Примечание.
Для преобразования JSON-текста в JSON-объект используется
функция parseJSON из библиотеки проекта json.org.

Выводы.

Плюсы:
* Данные могут закачиваться по требованию.
* Формат JSON очень прост.

Минусы:
* Правила отображения данных жестко "вшиты" в код программы,
для отделения логики от представления необходимо применить
технику шаблонов.

Файлы:
index.html
menu.js