2. 4.2.2. Основные понятия

DOM 2 Core представляет XML-документы в виде деревьев, состоящих из узлов, которые, в свою очередь, также являются объектами и реализуют более специализированные интерфейсы. Одни типы узлов могут иметь детей, т. е. сами являться поддеревьями, другие являются листьями, т. е. детей не имеют. В следующей таблице сведены все возможные типы узлов абстрактного документа; для каждого типа узлов перечислены те узлы, которые могут быть его детьми. О понятиях, соответствующих перечисленным узлам, см. описание структуры XML-документа.

Таблица 4.1. Структура дерева документа
Интерфейс	Описание	Дети
Document	Документ	Element (не более одного), ProcessingInstruction,Comment, DocumentType (не более одного)
DocumentFragment	Фрагмент документа	Element, ProcessingInstruction, Comment, Text,CDATASection, EntityReference
DocumentType	Тип документа	детей не имеет
EntityReference	Ссылка на раздел	Element, ProcessingInstruction, Comment, Text,CDATASection, EntityReference
Element	Элемент	Element, ProcessingInstruction, Comment, Text,CDATASection, EntityReference
Attr	Атрибут	Text, EntityReference
ProcessingInstruction	Директива XML	детей не имеет
Comment	Комментарий	детей не имеет
Text	Текст	детей не имеет
CDATASection	Секция CDATA	детей не имеет
Entity	Раздел	Element, ProcessingInstruction, Comment, Text,CDATASection, EntityReference
Notation	Нотация	детей не имеет

Кроме того, DOM 2 Core содержит спецификацию интерфейсов NodeList (упорядоченные списки узлов, доступных по номеру в списке) и NamedNodeMap (неупорядоченные списки узлов, доступных по своему имени). Эти объекты являются живыми, т. е. любое изменение документа автоматически влечет изменение всех связанных с ним списков.

Интерфейсы Text, Comment и CDATASection являются потомками интерфейса CharacterData.

Следует подчеркнуть, что DOM 2 Core содержит два набора интерфейсов, каждый из которых обеспечивает полный доступ ко всем элементам документа. Первый набор представляет объектно-ориентированный подход со следующей иерархией наследования: документ — составляющие его элементы — их атрибуты и текстовое содержимое. При таком рассмотрении дерева документа мы говорим о иерархии объектов. Второй подход построен по принципу "все есть узлы (Nodes)". Здесь все составляющие документа рассматриваются как равноправные узлы его дерева, и мы можем говорить только о иерархии узлов. Таким образом, DOM 2 по своей сути является избыточной, но предоставляет нам возможность в зависимости от задачи рассматривать документ тем или иным способом.

Все интерфейсы DOM 2 Core подразделяются на основные (fundamental) и дополнительные (extended). Основными являются интерфейсы DOMException, DOMImplementation,DocumentFragment, Document, Node, NodeList, NamedNodeMap, CharacterData, Attr,Element, Text и Comment. Эти интерфейсы должны поддерживаться всеми реализациями DOM, как для XML-, так и для HTML-документов. Дополнительные интерфейсы ориентированы на XML-документы, поэтому реализации DOM для HTML могут их не поддерживать. К ним относятся CDATASection, DocumentType, Notation, Entity, EntityReference иProcessingInstruction.

В целях независимости от языка и платформы DOM определяет следующие типы:

DOMString

Текстовая строка, состоящая из символов Unicode в формате UTF-16. В JavaScript и в Java реализуется типом String.

DOMTimeStamp

Дата и время в приемлемом для конкретного языка формате. Например, в JavaScript это будет объект Date, а в Java — целое число типа long, содержащее количество миллисекунд.

Ниже приведено краткое описание всех интерфейсов DOM с указанием уровня модели (DOM 1 или DOM 2), в которой определено то или иное свойство интерфейса. Спецификации W3C написаны на платформо-независимом языке IDL. Мы же приводим их в соответствии с синтаксисом JavaScript, который на сегодня является основным сценарным языком.

Вместе с описание стандарта мы приводим краткое описание его реализации в объектных моделях Microsoft и Gecko. При этом следует учитывать, что реализации Microsoft для XML и HTML совершенно независимы (они реализуются соответственно программными компонентами XMLDOM и MSHTML), тогда как в Gecko объектная модель одинакова для HTML- и XML-документов. Основное внимание в последующем изложении уделено DOM для HTML; XML DOM подробно будет рассмотрена в Части VIII.

24. jQuery. Назначение и принципы синтаксиса. Работa с DOM.

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

jQuery, как правило, включается в веб-страницу как один внешний JavaScript-файл:

<head>

<script type="text/javascript" src="путь к jQuery.js"></script>

</head>

Вся работа с jQuery ведётся с помощью функции $. Если на сайте применяются другие JavaScript библиотеки, где $ может использоваться для своих нужд, то можно использовать её синоним — jQuery. Второй способ считается более правильным, а чтобы код не получался слишком громоздким, можно писать его следующим образом:

jQuery(function($) {

// здесь код скрипта, где в $ будет находиться объект, предоставляющий доступ к функциям jQuery

})

Работу с jQuery можно разделить на 2 типа:

• Получение jQuery-объекта с помощью функции $(). Например, передав в неё CSS-селектор, можно получить jQuery-объект всех элементов HTML, попадающих под критерий и далее работать с ними с помощью различных методов jQuery-объекта. В случае, если метод не должен возвращать какого-либо значения, он возвращает ссылку на jQuery объект, что позволяет вести цепочку вызовов методов согласно концепции текучего интерфейса.

• Вызов глобальных методов у объекта $, например, удобных итераторов по массиву.

Типичный пример манипуляции сразу несколькими узлами DOM заключается в вызове $ функции со строкой селектора CSS, что возвращает объект jQuery, содержащий некоторое количество элементов HTML-страницы. Эти элементы затем обрабатываются методами jQuery. Например,

$("div.test").add("p.quote").addClass("blue").slideDown("slow");

находит все элементы div с классом test, а также все элементы p с классом quote, и затем добавляет им всем класс blue и визуально плавно спускает вниз. Здесь методы add,addClass и slideDown возвращают ссылку на исходный объект $("div.test"), поэтому возможно вести такую цепочку.

Методы, начинающиеся с $., удобно применять для обработки глобальных объектов. Например:

$.each([1,2,3], function() {

document.write(this + 1);

});

добавит на страницу 234.

$.ajax и соответствующие функции позволяют использовать методы AJAX. Например:

$.ajax({

type: "POST",

url: "some.php",

data: {name: 'John', location: 'Boston'},

success: function(msg){

alert( "Data Saved: " + msg );

}

});

В этом примере идет обращение к скрипту some.php с параметрами name=John&location=Boston, и полученный результат выдается в сообщении посредством alert().

Пример добавления к элементу обработчика события click с помощью jQuery:

$("a").click(function() {

alert("Hello world!");

});

В данном случае при нажатии на элемент <A> происходит вызов alert("Hello world!").

25. Технология Ajax. Основные принципы работы. Основные объекты. Примеры использования. JSON.

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

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

• с использованием XMLHttpRequest (основной объект);

• через динамическое создание дочерних фреймов^[1];

• через динамическое создание тега <script>^[2].

• через динамическое создание тега <img>, как это реализовано в google analytics.

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

Действия с интерфейсом преобразуются в операции с элементами DOM (англ. Document Object Model), с помощью которых обрабатываются данные, доступные пользователю, в результате чего представление их изменяется. Здесь же производится обработка перемещений и щелчков мышью, а также нажатий клавиш. Каскадные таблицы стилей, или CSS (англ. Cascading Style Sheets), обеспечивают согласованный внешний вид элементов приложения и упрощают обращение к DOM-объектам. Объект XMLHttpRequest (или подобные механизмы) используется для асинхронного взаимодействия с сервером, обработки запросов пользователя и загрузки в процессе работы необходимых данных.

Три из этих четырех технологий — CSS, DOM и JavaScript — составляют DHTML (англ. Dynamic HTML). По мнению некоторых специалистов^{[каких?]} средства DHTML, появившиеся в1997 году, подавали большие надежды, но так и не оправдали их.

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

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

Следующий пример Javascript-кода показывает, как браузер может использовать XMLHttpRequest, чтобы запрашивать с сервера объект в формате JSON (cерверная часть программы опущена; в ней должен быть размещён код, отправляющий данные в формате JSON-строки в ответ на запросы по url).

var the_object;

var http_request = new XMLHttpRequest();

http_request.open( "GET", url, true );

http_request.send(null);

http_request.onreadystatechange = function () {

if ( http_request.readyState == 4 ) {

if ( http_request.status == 200 ) {

the_object = JSON.parse(http_request.responseText);

} else {

alert( "There was a problem with the URL." );

}

http_request = null;

}

};

Заметим, что данный пример применения XMLHttpRequest не является универсальным для всех браузеров (для браузеров, основанных на Internet Explorer, Opera, Safari и Mozilla, в коде должны быть те или иные отличия). Возможности применения XMLHttpRequest ограничены из-за правила ограничения домена (same origin policy): URL ответа на запрос должен находиться в том же DNS домене, что и сервер, на котором находится страница, запрашивающая ответ. В качестве альтернативы применяется подход JSONP, включающий в себя использование закодированного вызова функции, передающегося между клиентом и сервером, чтобы клиент мог загружать закодированные в JSON данные со сторонних доменов, и уведомлять о завершении вызывающую сторону, хотя это приводит к некоторым рискам для безопасности и дополнительным требованиям к серверу.

Как вариант, в коде страницы можно использовать элементы <iframe> для асинхронного запроса JSON данных, или просто <form action="url_to_cgi_script" target="name_of_hidden_iframe"> . Эти подходы были распространены до появления широкой поддержки XMLHttpRequest.

Также можно использовать для передачи JSON-данных динамические теги <script>. С помощью этого метода можно обойти правило ограничения домена (same origin policy), но он приводит к появлению уязвимого кода. В качестве более безопасной альтернативы было предложено использовать JSONRequest.

26. Проверка значений веб-форм с помощью JavaScript. Привести примеры.

Примеры проверок, которые возможно реализовать с помощью JavaScript:

• Было ли данное поле заполнено;

• В правильном ли формате пользователь указал свой адрес или email в соответствующем поле;

• Совпадают ли значения введенные в два различных поля (часто используется для полей с паролем);

• Не превышает ли значение введенное в поле максимально допустимую длину и т.д.

Проверка форм в JavaScript возможна благодаря событию onSubmit.

Если у тэга form атрибут onsubmit="return true" форма будет отправлена на сервер, если же onsubmit="return false", то форма на сервер отправлена не будет.

Пример кода

<html>

<head>

<script type="text/javascript">

function validate(){

//Считаем значения из полей name и email в переменные x и y

var x=document.forms["form"]["name"].value;

var y=document.forms["form"]["email"].value;

//Если поле name пустое выведем сообщение и предотвратим отправку формы

if (x.length==0){

document.getElementById("namef").innerHTML="*данное поле обязательно для

заполнения";

return false;

}

//Если поле email пустое выведем сообщение и предотвратим отправку формы

if (y.length==0){

document.getElementById("emailf").innerHTML="*данное поле обязательно для

заполнения";

return false;

}

//Проверим содержит ли значение введенное в поле email символы @ и .

at=y.indexOf("@");

dot=y.indexOf(".");

//Если поле не содержит эти символы знач email введен не верно

if (at<1 || dot <1){

document.getElementById("emailf").innerHTML="*email введен не верно";

return false;

}

}

</script>

</head>

<body>

<form name="form" onsubmit="return validate()">

Имя: <input type="text" name="name"> <span style="color:red" id="namef"></span><br />

e-mail: <input type="text" name="email"> <span style="color:red" id="emailf"></span>

<br /><input type="submit" value="Отправить форму">

</form>

</body>

</html>

27. Интерфейс CGI. Способы передачи данных. Запоминание состояния.

CGI (от англ. Common Gateway Interface — «общий интерфейс шлюза») — стандарт интерфейса, используемого для связи внешней программы с веб-сервером. Программу, которая работает по такому интерфейсу совместно с веб-сервером, принято называть шлюзом, хотя многие предпочитают названия «скрипт» (сценарий) или «CGI-программа».

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

Все скрипты, как правило, помещают в каталог cgi (или cgi-bin) сервера, но это необязательно: скрипт может располагаться где угодно, но при этом большинство веб-серверов требуют специальной настройки. В веб-сервере Apache, например, такая настройка может производиться при помощи общего файла настроек httpd.conf или с помощью файла.htaccess в том каталоге, где содержится этот скрипт.

CGI является одним из наиболее распространённых средств создания динамических веб-страниц.

Пример скрипта Hello World на языке Python:

#!/usr/bin/python

print("""Content-Type: text/plain

Hello, world!""")

Пример программы Hello World на языке C:

#include <stdio.h>

int main(void) {

printf("Content-Type: text/plain;charset=us-ascii\n\n");

printf("Hello, world!\n\n");

return 0;

}

28. СУБД MySQL. Характеристика и особенности.

MySQL является решением для малых и средних приложений. Входит в состав серверов WAMP, AppServ, LAMP и в портативные сборки серверов Денвер, XAMPP. Обычно MySQL используется в качестве сервера, к которому обращаются локальные или удалённые клиенты, однако в дистрибутив входит библиотека внутреннего сервера, позволяющая включать MySQL в автономные программы.

Гибкость СУБД MySQL обеспечивается поддержкой большого количества типов таблиц: пользователи могут выбрать как таблицы типаMyISAM, поддерживающие полнотекстовый поиск, так и таблицы InnoDB, поддерживающие транзакции на уровне отдельных записей. Более того, СУБД MySQL поставляется со специальным типом таблиц EXAMPLE, демонстрирующим принципы создания новых типов таблиц. Благодаря открытой архитектуре и GPL-лицензированию, в СУБД MySQL постоянно появляются новые типы таблиц.

29. Язык SQL. Создание и удаление баз данных и таблиц в MySQL

30. Типы данных в MySQL. Ключи, индексы, автоинкрементирование. Изменение структуры таблиц.

Первичный ключ (primary key, PK) – минимальный набор полей, уникально идентифицирующий запись в таблице. Значит, первичный ключ – это в первую очередь набор полей таблицы, во-вторых, каждый набор значений этих полей должен определять единственную запись (строку) в таблице и, в-третьих, этот набор полей должен быть минимальным из всех обладающих таким же свойством. Поскольку первичный ключ определяет только одну уникальную запись, то никакие две записи таблицы не могут иметь одинаковых значений первичного ключа. Например, в нашей таблице (см. выше) ФИО и адрес позволяют однозначно выделить запись о человеке. Если же говорить в общем, без связи с решаемой задачей, то такие знания не позволяют точно указать на единственного человека, поскольку существуют однофамильцы, живущие в разных городах по одному адресу. Все дело в границах, которые мы сами себе задаем. Если считаем, что знания ФИО, телефона и адреса без указания города для наших целей достаточно, то все замечательно, тогда поля ФИО и адрес могут образовывать первичный ключ. В любом случае проблема создания первичного ключа ложится на плечи того, кто проектирует базу данных (разрабатывает структуру хранения данных). Решением этой проблемы может стать либо выделение характеристик, которые естественным образом определяют запись в таблице (задание так называемого логического, или естественного, PK), либо создание дополнительного поля, предназначенного именно для однозначной идентификации записей в таблице (задание так называемого суррогатного, или искусственного, PK). Примером логического первичного ключа является номер паспорта в базе данных о паспортных данных жителей или ФИО и адрес в телефонной книге (таблица выше). Для задания суррогатного первичного ключа в нашу таблицу можно добавить поле id (идентификатор), значением которого будет целое число, уникальное для каждой строки таблицы. Использование таких суррогатных ключей имеет смысл, если естественный первичный ключ представляет собой большой набор полей или его выделение нетривиально. Кроме однозначной идентификации записи, первичные ключи используются для организации связей с другими таблицами. Например, у нас есть три таблицы: содержащая информацию об исторических личностях (Persons), содержащая информацию об их изобретениях (Artifacts) и содержащая изображения как личностей, так и артефактов (Images) (рис 10.1). Первичным ключом во всех этих таблицах является поле id (идентификатор). В таблице Artifacts есть поле author, в котором записан идентификатор, присвоенный автору изобретения в таблице Persons. Каждое значение этого поля является внешним ключом для первичного ключа таблицы Persons. Кроме того, в таблицах Persons и Artifacts есть поле photo, которое ссылается на изображение в таблице Images. Эти поля также являются внешними ключами для первичного ключа таблицы Images и устанавливают однозначную логическую связь Persons-Images и Artifacts-Images. То есть если значение внешнего ключа photo в таблице личности равно 10, то это значит, что фотография этой личности имеет id=10 в таблице изображений. Таким образом, внешние ключи используются для организации связей между таблицами базы данных (родительскими и дочерними) и для поддержания ограничений ссылочной целостности данных.

Одна из основных задач, возникающих при работе с базами данных, – это задача поиска. При этом, поскольку информации в базе данных, как правило, содержится много, перед программистами встает задача не просто поиска, а эффективного поиска, т.е. поиска за сравнительно небольшое время и с достаточной точностью.  Для этого (для оптимизации производительности запросов) производят индексирование некоторых полей таблицы. Использовать индексы полезно для быстрого поиска строк с указанным значением одного столбца. Без индекса чтение таблицы осуществляется по всей таблице, начиная с первой записи, пока не будут найдены соответствующие строки. Чем больше таблица, тем больше накладные расходы. Если же таблица содержит индекс по рассматриваемым столбцам, то база данных может быстро определить позицию для поиска в середине файла данных без просмотра всех данных. Это происходит потому, что база данных помещает проиндексированные поля поближе в памяти, так, чтобы можно было побыстрее найти их значения. Для таблицы, содержащей 1000 строк, это будет как минимум в 100 раз быстрее по сравнению с последовательным перебором всех записей. Однако в случае, когда необходим доступ почти ко всем 1000 строкам, быстрее будет последовательное чтение, так как при этом не требуется операций поиска по диску. Так что иногда индексы бывают только помехой. Например, если копируется большой объем данных в таблицу, то лучше не иметь никаких индексов. Однако в некоторых случаях требуется задействовать сразу несколько индексов (например, для обработки запросов к часто используемым таблицам). Если говорить о Mysql, то там существует три вида индексов: PRIMARY, UNIQUE, и INDEX, а слово ключ (KEY) используется как синоним слова индекс (INDEX). Все индексы хранятся в памяти в виде B-деревьев. PRIMARY – уникальный индекс (ключ) с ограничением, что все индексированные им поля не могут иметь пустого значения (т.е. они NOT NULL). Таблица может иметь только один первичный индекс, но он может состоять из нескольких полей. UNIQUE – ключ (индекс), задающий поля, которые могут иметь только уникальные значения. INDEX – обычный индекс (как мы описали выше). В Mysql, кроме того, можно индексировать строковые поля по заданному числу символов от начала строки.

31. Запросы на добавление, изменение и удаление данных.

Добавление данных в эту таблицу осуществляется при помощи SQL-команды INSERT. Например:

INSERT INTO books ( ISBN, author, title, price, quantity )

VALUES ('5-8459-0184-7', 'Зандстра Мэт',

'Освой самостоятельно PHP4 за 24 часа', '129', '5');

Для извлечения данных из таблицы служит оператор SELECT. Он извлекает данные из базы, выбирая строки, которые отвечают заданному критерию поиска. Оператор SELECT сопровождает немалое количество опций и вариантов использования.

Символ * означает, что необходимы все поля. Например:

SELECT * FROM books;

Для получения доступа только к некоторому полю следует указать его имя в инструкции SELECT. Например:

SELECT author, title, price FROM books;

Чтобы получить доступ к подмножеству строк в таблице, следует указать критерий выбора, который устанавливает конструкция WHERE. Например, чтобы выбрать имеющиеся в наличии недорогие книги о PHP, надо составить запрос:

SELECT * FROM books WHERE

price < 200 AND title LIKE '%PHP%' AND quantity != 0;

% Соответствует любому количеству символов, даже нулевых _ Соответствует ровно одному символу

Для того, чтобы строки, извлеченные по запросу, перечислялись в определенном порядке, используется конструкция ORDER BY. Например:

SELECT * FROM books ORDER BY price;

По умолчанию порядок сортировки идет по возрастанию. Изменить порядок сортировки на обратный можно с помощью ключевого слова DESC:

SELECT * FROM books ORDER BY price DESC;

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

SELECT * FROM books ORDER BY 4, 2, 3;

Для изменения ранее записанных в таблицу значений нужно воспользоваться командой UPDATE. Например, цену всех книг повысили на 10%:

UPDATE books SET price = price * 1.1;

Конструкция WHERE ограничит работу UPDATE определенным строками. Например:

UPDATE books SET price = price * 1.05 WHERE price <= 250;

Для удаления строк из базы данных используется оператор DELETE. Ненужные строки указываются при помощи конструкции WHERE. Например, какие-то книги проданы:

DELETE FROM books WHERE quantity = 0;

32. Запросы на извлечение данных. Объединения. Псевдонимы, группировка и упорядочивание.

Поработав с phpMyAdmin над созданием базы данных, можно приступить к подключению этой базы данных к внешнему Web-интерфейсу.

Чтобы получить доступ к базе данных из Web, используя PHP, надо сделать следующие основные шаги:

• Подключение к серверу MySQL.

• Выбор базы данных.

• Выполнение запроса к базе данных:

  • добавление;

  • удаление;

  • изменение;

  • поиск;

  • сортировка.

• Получение результата запроса.

• Отсоединение от базы данных.

Для подключения к серверу базы данных в PHP есть функция mysql_connect( ). Ее аргументы: имя компьютера, имя пользователя и пароль. Эти аргументы можно опустить. По умолчанию имя компьютера =localhost, тогда имя пользователя и пароль не требуется. Если PHP используется в сочетании с сервером Apache, то можно воспользоваться функцией mysql_pconnect(). В этом случае соединение с сервером не исчезает после завершения работы программы или вызова функции mysql_close(). Функцииmysql_connect() и mysql_pconnect() возвращают идентификатор подключения, если все прошло успешно. Например:

$link = mysql_pconnect ();

if ( !$link ) die ("Невозможно подключение к MySQL");

После того, как соединение с сервером MySQL установлено, нужно выбрать базу данных. Для этого используется функция mysql_select_db(). Ее аргумент: имя базы данных. Функция возвращает true, если указанная база данных существует и доступ к ней возможен. Например:

$db = "sample";

mysql_select_db ( $db ) or die ("Невозможно открыть $db");

Для добавления, удаления, изменения и выбора данных нужно сконструировать и выполнить запрос SQL. Для этого в языке PHP существует функция mysql_query(). Ее аргумент: строка с запросом. Функция возвращает идентификатор запроса.