Сведения об XML и XSLT

Применение XML и XSL на веб-страницах

Extensible Markup Language (XML) это язык, который позволяет структурировать информацию. Как и HTML, XML позволяет структурировать информацию с помощью тегов, но теги XML не предопределены, как теги HTML. Вместо этого XML позволяет создавать теги, которые лучше всего определяют структуру ваших данных (схему). Теги вкладываются в другие теги для создания схемы родительских и дочерних тегов. Как и большинство тегов HTML, все теги в схеме XML имеют открывающий и закрывающий теги.

В приведенном ниже примере показана основная структура XML-файла.

<?xml version="1.0">

<mybooks>

<book bookid="1">

<pubdate>03/01/2004</pubdate>

<title>Displaying XML Data with Adobe Dreamweaver</title>

<author>Charles Brown</author>

</book>

<book bookid="2">

<pubdate>04/08/2004</pubdate>

<title>Understanding XML</title>

<author>John Thompson</author>

</book>

</mybooks>

В этом примере каждый родительский тег <book> содержит три дочерних тега: <pubdate>, <title> и <author>. Но каждый тег <book> также является дочерним тегом тега <mybooks>, который находится на один уровень выше в схеме.Вы можете именовать и структурировать теги XML любым способом, при условии что вы соответственно вкладываете теги в другие, и назначаете каждому открывающему тегу соответствующий закрывающий тег.

XML-документы не содержат никакого форматирования — они являются просто контейнерами структурированной информации. После создания схемы XML вы можете использовать Extensible Stylesheet Language (XSL) для отображения информации. Так же, как каскадные таблицы стилей (CSS) позволяют форматировать HTML, XSL позволяет форматировать данные XML. Вы можете определить стили, элементы страницы, макет и так далее в файле XSL и прикрепить его к файлу XML, чтобы когда пользователь просматривает данные XML в браузере, данные форматировались в соответствии с тем, что вы определили в файле XSL. Контент (данные XML) и представление (определяемое файлом XSL) полностью разделены, что обеспечивает больший контроль над тем, как ваша информация отображается на веб-странице. По сути, XSL — это технология представления для XML, где основным выводом является HTML-страница.

Extensible Stylesheet Language Transformations (XSLT) — это подмножество языка XSL, которое позволяет отображать данные XML на веб-странице и «преобразовывать» их вместе со стилями XSL в читаемую, стилизованную информацию в виде HTML. Вы можете использовать Dreamweaver для создания XSLT-страниц, позволяющих выполнять XSL-преобразования с помощью сервера приложений или браузера. В серверном XSL-преобразовании сервер выполняет работу по преобразованию XML и XSL и отображению их на странице. В клиентском преобразовании браузер (например, Internet Explorer) выполняет эту работу.

Подход, который вы в конечном итоге выберете (серверные преобразования против клиентских преобразований), зависит от того, чего вы пытаетесь достичь в качестве конечного результата, доступных вам технологий, уровня доступа к исходным XML-файлам и других факторов. Оба подхода имеют свои достоинства и ограничения. Например, серверные преобразования работают во всех браузерах, в то время как клиентские преобразования ограничены только современными браузерами (Internet Explorer 6, Netscape 8, Mozilla 1.8 и Firefox 1.0.2). Серверные преобразования позволяют динамически отображать данные XML с вашего собственного сервера или с любого другого места в сети, в то время как клиентские преобразования должны использовать данные XML, размещенные локально на вашем собственном веб-сервере. Наконец, серверные преобразования требуют развертывания ваших страниц на настроенном сервере приложений, в то время как клиентские преобразования требуют только доступа к веб-серверу.

Руководство по XML можно найти по адресу www.adobe.com/go/vid0165_ru.

XSL-преобразование на сервере

Dreamweaver предоставляет методы для создания XSLT-страниц, позволяющих выполнять серверные XSL-преобразования. Когда сервер приложений выполняет XSL-преобразование, файл, содержащий данные XML, может находиться на вашем собственном сервере или в любом другом месте в сети. Кроме того, любой браузер может отображать преобразованные данные. Развертывание страниц для серверных преобразований, однако, довольно сложно и требует доступа к серверу приложений.

При работе с серверными XSL-преобразованиями вы можете использовать Dreamweaver для создания XSLT-страниц, генерирующих полные HTML-документы (целые XSLT-страницы), или XSLT-фрагменты, генерирующие часть HTML-документа. Целая XSLT-страница похожа на обычную HTML-страницу. Она содержит тег <body> и тег <head> и позволяет отображать комбинацию HTML и XML данных на странице. XSLT-фрагмент — это фрагмент кода, используемый отдельным документом, который отображает форматированные XML-данные. В отличие от целой XSLT-страницы, это независимый файл, который не содержит тегов <body> или <head>. Если вы хотите отобразить XML-данные на отдельной странице, вы бы создали целую XSLT-страницу и привязали к ней ваши XML-данные. Если, с другой стороны, вы хотели отобразить XML-данные в определенном разделе существующей динамической страницы — например, динамической главной страницы для магазина спортивных товаров, со спортивными результатами из RSS-ленты, отображаемыми на одной стороне страницы — вы бы создали XSLT-фрагмент и вставили ссылку на него в динамической странице. Создание XSLT-фрагментов и их использование в сочетании с другими динамическими страницами для отображения XML-данных является более распространенным сценарием.

Первый шаг при создании страниц такого типа — создать XSLT-фрагмент.Это отдельный файл, который содержит разметку, форматирование и так далее XML-данных, которые в итоге необходимо отобразить на динамической странице.После создания XSLT-фрагмента необходимо вставить ссылку на него в динамическую страницу (например, страницу PHP или ColdFusion).Вставленная ссылка на фрагмент работает так же, как Server Side Include (SSI) — отформатированные XML-данные (фрагмент) находятся в отдельном файле, а в режиме «Дизайн» на самой динамической странице появляется заполнитель для него.Когда браузер запрашивает динамическую страницу, содержащую ссылку на фрагмент, сервер обрабатывает включенную инструкцию и создает новый документ, в котором отформатированное содержимое фрагмента появляется вместо заполнителя.

Используйте серверное поведение XSL Transformation для вставки ссылки на фрагмент XSLT в динамическую страницу.При вставке ссылки Dreamweaver создает папку includes/MM_XSLTransform/ в корневой папке сайта, которая содержит файл библиотеки времени выполнения.Сервер приложений использует функции, определенные в этом файле, при преобразовании указанных данных XML.Файл отвечает за получение данных XML и фрагментов XSLT, выполнение преобразования XSL и вывод результатов на веб-страницу.

Файл, содержащий фрагмент XSLT, файл XML с вашими данными и созданный файл библиотеки времени выполнения должны находиться на сервере, чтобы ваша страница отображалась правильно.(Если вы выбираете удаленный файл XML в качестве источника данных — например, из RSS-канала — этот файл, конечно, должен находиться где-то еще в интернете.)

Также можно использовать Dreamweaver для создания полных страниц XSLT для использования с серверными преобразованиями.Полная страница XSLT работает точно так же, как фрагмент XSLT, только при вставке ссылки на всю страницу XSLT с помощью серверного поведения XSL Transformation вы вставляете полное содержимое HTML-страницы.Таким образом, динамическая страница (страница .cfm, .php или .asp, которая выступает в качестве страницы-контейнера) должна быть очищена от всего HTML-кода перед вставкой ссылки.

Dreamweaver поддерживает преобразования XSL для страниц ColdFusion, ASP и PHP.

XSL-преобразование на стороне клиента

XSL-преобразования можно выполнять на стороне клиента без использования сервера приложений. С помощью Dreamweaver можно создавать целые XSLT-страницы, которые будут выполнять преобразования. Однако преобразования на стороне клиента требуют работы с XML-файлом, содержащим данные для отображения. Кроме того, преобразование на стороне клиента поддерживается только в современных браузерах (Internet Explorer 6, Netscape 8, Mozilla 1.8 и Firefox 1.0.2). 

Сначала создадим целую XSLT-страницу и присоединим источник XML-данных. (Dreamweaver выдаст запрос на присоединение источника данных при создании новой страницы.) Создать XSLT-страницу можно как с нуля, так и путем преобразования в XSLT-страницу существующей HTML-страницы. При преобразовании в XSLT-страницу существующей HTML-страницы необходимо присоединить источник XML-данных с помощью панели «Привязки» («Окно» > «Привязки»).

После создания XSLT-страницы необходимо привязать ее к XML-файлу, содержащему XML-данные. Для этого нужно вставить ссылку на XSLT-страницу в самом XML-файле (во многом аналогично тому, как вставляется ссылка на внешнюю таблицу стилей CSS в разделе <head> HTML-страницы). Посетители сайта должны в своем браузере просматривать XML-файл (а не XSLT-страницу). Когда посетители сайта просматривают страницу, браузер выполняет XSL-преобразование и отображает XML-данные, отформатированные с помощью связанной XSLT-страницы.

Отношения между связанной XSLT-страницей и XML-страницей принципиально аналогичны, но они отличаются от модели внешнего CSS-файла/HTML-страницы. Содержимое HTML-страницы (например, текст) форматируется с помощью внешней таблицы стилей. HTML-страница определяет содержимое, а внешний код CSS, который пользователь никогда не видит, определяет представление содержимого. При использовании XSLT и XML ситуация прямо противоположна. XML-файл (который пользователь никогда не видит в необработанном виде) определяет содержимое, в то время как XSLT-страница определяет его представление. XSLT-страница содержит таблицы, макет, графические элементы и т. д. — все, что обычно содержит стандартная HTML-страница. Когда пользователь просматривает в браузере XML-файл, XSLT-страница форматирует содержимое.

При использовании Dreamweaver для связывания страницы XSLT со страницей XML Dreamweaver вставляет соответствующий код в верхнюю часть страницы XML.Если вы владеете страницей XML, с которой устанавливаете связь (то есть если файл XML находится исключительно на вашем веб-сервере), все, что вам нужно сделать, — это использовать Dreamweaver для вставки соответствующего кода, который связывает две страницы.Когда вы владеете файлом XML, преобразования XSL, выполняемые клиентом, полностью динамичны.То есть всякий раз, когда вы обновляете данные в файле XML, любой HTML-вывод с использованием связанной страницы XSLT будет автоматически обновляться новой информацией.

Если вы не владеете страницей XML, с которой устанавливаете связь (например, если хотите использовать данные XML из RSS-канала где-то в интернете), рабочий процесс немного сложнее.Для выполнения клиентских преобразований с использованием данных XML из внешнего источника сначала необходимо загрузить исходный файл XML в тот же каталог, где находится ваша страница XSLT.Когда страница XML находится в вашем локальном сайте, можно использовать Dreamweaver для добавления соответствующего кода, который связывает ее со страницей XSLT, и опубликовать обе страницы (загруженный файл XML и связанную страницу XSLT) на вашем веб-сервере.Когда пользователь просматривает страницу XML в браузере, страница XSLT форматирует контент точно так же, как в предыдущем примере.

Недостаток выполнения клиентских XSL-преобразований XML-данных, поступающих из внешнего источника, заключается в том, что XML-данные являются только частично «динамическими». XML-файл, который вы загружаете и изменяете, является просто «снимком» файла, который находится где-то еще в Интернете.Если исходный XML-файл в веб-версии изменяется, вам необходимо загрузить файл снова, связать его со страницей XSLT и повторно опубликовать XML-файл на вашем веб-сервере. Браузер отображает только данные, которые он получает от XML-файла на вашем веб-сервере, а не данные, содержащиеся в исходном XML-файле источника.

XML-данные и повторяющиеся элементы

Объект XSLT «Повторяющаяся область» позволяет отображать повторяющиеся элементы из XML-файла на странице. Любую область, содержащую заполнитель XML-данных, можно превратить в повторяющуюся область. Однако наиболее распространенными областями являются таблица, строка таблицы или серия строк таблицы.

Следующий пример показывает, как объект XSLT «Повторяющаяся область» применяется к строке таблицы, которая отображает информацию о меню ресторана. Исходная строка отображает три различных элемента из XML-схемы: позицию, описание и цену. Когда объект XSLT «Повторяющаяся область» применяется к строке таблицы, и страница обрабатывается сервером приложений или браузером, таблица повторяется с уникальными данными, вставленными в каждую новую строку таблицы.

При применении объекта XSLT «Повторяющаяся область» к элементу в окне «Документ» тонкий контур с вкладками серого цвета появляется вокруг повторяющейся области. При предварительном просмотре работы в браузере («Файл» > «Предварительный просмотр в браузере») серый контур исчезает, и выбранная область расширяется для отображения указанных повторяющихся элементов в XML-файле, как показано на предыдущей иллюстрации.

При добавлении объекта XSLT «Повторяющаяся область» на страницу длина заполнителя XML-данных в окне «Документ» сокращается. Это происходит потому, что Dreamweaver обновляет выражение XPath (язык XML-путей) для заполнителя XML-данных так, чтобы оно было относительным к пути повторяющегося элемента.

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

<table width="500" border="1">

    <tr> 

<td><xsl:value-of select="rss/channel/item/title"/></td>

    </tr> 

    <tr> 

<td><xsl:value-of select="rss/channel/item/description"/></td>

    </tr> 

</table>

Следующий код предназначен для той же таблицы с примененным к ней объектом XSLT «Повторяющаяся область»:

<xsl:for-each select="rss/channel/item">

<table width="500" border="1">

        <tr> 

<td><xsl:value-of select="title"/></td>

        </tr> 

        <tr> 

<td><xsl:value-of select="description"/></td>

        </tr> 

    </table> 

</xsl:for-each>

В предыдущем примере Dreamweaver обновил XPath для элементов, находящихся в повторяющейся области (title и description), чтобы они были относительными к XPath в окружающих тегах <xsl:for-each>, а не к полному документу.

Dreamweaver создает контекстно-относительные выражения XPath и в других случаях.Например, если вы перетащите заполнитель данных XML в таблицу, к которой уже применен объект Repeating Region XSLT, Dreamweaver автоматически отобразит XPath относительно существующего XPath в окружающих тегах <xsl:for-each>.

Предварительный просмотр XML-данных

При использовании функции «Предварительный просмотр в браузере» («Файл» > «Предварительный просмотр в браузере») для предварительного просмотра XML-данных, которые вы вставили во фрагмент XSLT или на всю страницу XSLT, механизм, выполняющий XSL-преобразование, различается в зависимости от ситуации.Для динамических страниц, содержащих фрагменты XSLT, сервер приложений всегда выполняет преобразование. В других случаях преобразование может выполняться либо Dreamweaver, либо браузером.

Следующая таблица содержит сводку ситуаций при использовании Preview in Browser и механизмов, которые выполняют соответствующие преобразования:

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

Предварительный просмотр страниц для преобразования на сервере

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

Предварительный просмотр страниц для преобразования на стороне клиента

В случае преобразований на стороне клиента контент, который в конечном итоге видит посетитель сайта, преобразуется браузером. Для этого добавьте ссылку из файла XML на страницу XSLT.Если вы откроете файл XML в Dreamweaver и просмотрите его в браузере, вы заставите браузер загрузить файл XML и выполнить преобразование. Это обеспечит вам такой же опыт, как у посетителя вашего сайта.

Однако использование этого подхода затрудняет отладку вашей страницы, поскольку браузер преобразует XML и генерирует HTML внутри себя.Если вы выберете в браузере параметр «View Source» для отладки сгенерированного HTML, вы увидите только исходный XML, который получил браузер, а не полный HTML (теги, стили и т. д.), отвечающий за отображение страницы. Чтобы увидеть полный HTML при просмотре исходного кода, необходимо вместо этого просмотреть страницу XSLT в браузере.

Предварительный просмотр целых XSLT-страниц и XSLT-фрагментов

При создании целых страниц XSLT и фрагментов XSLT вам потребуется просматривать вашу работу, чтобы убедиться, что ваши данные отображаются правильно. Если вы используете Preview in Browser для отображения целой страницы XSLT или фрагмента XSLT, Dreamweaver выполняет преобразование, используя встроенный механизм преобразования. Этот метод дает вам быстрые результаты и облегчает поэтапное создание и отладку вашей страницы. Он также предоставляет способ просмотра полного HTML (теги, стили и т. д.) путем выбора параметра «View Source» в браузере.

Связанные материалы

• Руководство по XML
• Выполнение XSL-преобразования на сервере
• Выполнение XSL-преобразования на стороне клиента
• Отображение повторяющихся XML-элементов