Как вставить xml в html

Связывание данных: отображение XML-документа на Web-странице

Понятие о связывании данных

Метод связывания данных сводится к установке связи XML-документа с HTML-страницей, а также сцеплению элементов HTML с XML-элементами. В результате HTML-элементы автоматически отображают содержимое XML-элементов, с которыми они сцеплены. В этом случае при открытии HTML-страницы встроенный в Internet Explorer XML-процессор синтаксически анализирует XML-документ. При этом Internet Explorer создаёт программный объект, который носит название «Объект исходных данных» (Data Source Object, DSO). Объект DSO хранит данные XML и обеспечивает доступ к ним. DSO позволяет осуществлять доступ и манипулирование XML-данными посредством ряда методов, свойств и событий.

Если вы открываете XML-документ описанным выше способом (через HTML-страницу), Internet Explorer проверяет, является ли документ корректно сформированным, а также, если документ включает объявление типа документа — является ли документ валидным. Если документ содержит ошибку (не является валидным), Internet Explorer просто не будет отображать данные XML, не выводя сообщение об ошибке. Если документ содержит DTD (объявление типа документа), вы должны исчерпывающе описать все возможные элементы (спецификацию содержимого «ANY» использовать нельзя).

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

Основные шаги при связывании данных:

Сцепление HTML-элементов с XML-элементами, например:

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

Однако согласно идеологии XML собственно данные (XML-документ) должны храниться отдельно от информации по их форматированию и обработке. Поэтому как правило HTML-элемент с именем XML (фрагмент данных) остаётся пустым и содержит только идентификатор объекта DSO и URL XML-документа, который находится в отдельном файле. Идентификатор фрагмента данных (атрибут ID) используется для доступа к XML-документу с HTML-страницы и должен быть уникальным.

Сцепление HTML-элементов с XML-элементами осуществляется двумя основными способами:

Табличное сцепление. Сцепление HTML-элемента TABLE с данными XML, так что в таблице автоматически отображается весь набор записей, принадлежащий XML-документу.
Сцепление по отдельным записям. Сцепление нетабличных HTML-элементов (например, элементов SPAN) с XML-элементами таким образом, что за один раз отображается только одна запись.

Табличное сцепление данных

При табличном сцеплении Internet Explorer берёт на себя бóльшую часть работы. Вам не нужно писать сценарии. Только если вы выбрали режим пролистывания, вам потребуется включить несколько вызовов простых функций. Кроме того, вы можете использовать вложенные HTML-таблицы для отображения XML-документа, содержащего иерархический набор записей.

Если данные XML-документа организованы в виде простого набора записей, т.е. если корневой элемент содержит множество элементов («записей»), каждый из которых содержит одинаковый набор элементов («полей»), а каждое «поле» содержит уже только символьные данные, вы можете использовать один единственный HTML-элемент TABLE для отображения XML-документа. Пример такого XML-документа:

Отображение XML-документов с использованием таблиц каскадных стилей

Вставка элементов HTML в XML-документы и использование пространства имен

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

Вам может показаться, что можно вставить HTML -элемент, просто присвоив XML -элементу такое же имя. Например, вставить HTML -элемент IMG , просто создав элемент IMG следующим образом:

Однако у браузера нет возможности узнать, что это HTML -элемент, а не обычный созданный вами XML -элемент. Чтобы подобный механизм мог работать, все имена HTML -элементов (а их много) должны были быть зарезервированы исключительно для вставки HTML -элементов. Такой подход, однако, противоречил бы духу XML , в соответствии с которым вам разрешается использовать для ваших элементов любые корректно заданные имена.

К счастью, вы можете воспользоваться соглашением XML , известным как пространство имен , которое позволяет различать конфликтующие имена. Два разных элемента могут иметь одно и то же имя, если они принадлежат разным пространствам имен.

Идентификатор пространства имен добавляется в начале имени элемента и отделяется от остальной части имени двоеточием (:), как в следующем примере:

Элемент с именем my-namespace:MY-ELEMENT и элемент с именем MY-ELEMENT могут существовать в одном и том же документе и считаются различными элементами, поскольку принадлежат отдельным пространствам имен: my-namespace:MY-ELEMENT принадлежит пространству имен my-namespace , а элемент MY-ELEMENT по умолчанию принадлежит к пространству имен документа.

Однако прежде чем вы сможете использовать пространство имен , вы должны соответствующим образом объявить его. Хотя есть несколько мест, в которых вы можете сделать объявление пространства имен, проще всего это сделать внутри начального тега элемента, для которого вы хотите использовать пространство имен . Например, вы можете объявить пространство имен my-namespace , как показано на рисунке 7.38.

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

Если имя XML -элемента совпадает с именем стандартного HTML -элемента (например, IMG , A или HR ) и если он принадлежит пространству имен html , Internet Explorer 5 интерпретирует его как HTML -элемент и поместит его на отображаемую страницу. Однако если элемент не принадлежит пространству имен html , Internet Explorer 5 интерпретирует его как обычный XML -элемент.

Пространство имен html является специальным, зарезервированным пространством имен, которое объявляется следующим образом:

Вот пример XML -элемента, который указывает Internet Explorer 5 вставить HTML -элемент IMG , для которого источником изображения является файл Raven.bmp:

Это корректно сформированный пустой XML -элемент. Его имя включает указание пространства имен, он также имеет два атрибута. Первый атрибут объявляет пространство имен , в то время как второй атрибут является стандартным HTML -атрибутом, который вы можете включить в начальный тег HTML -элемента IMG .

Имейте в виду, что если вы вставляете HTML -элемент описанным выше способом, XML -документ должен иметь присоединенную таблицу стилей, и вы должны открыть его непосредственно в браузере (как и все XML -документы, описанные в этой лекции).

Ссылка. Официальную спецификацию пространства имен вы можете найти на Web-странице консорциума W3C по адресу http://www.w3.org/TR/REC-xml-names/.

Версия документа Inventory01.css , представленная в Листинге 7.1, иллюстрирует технику включения HTML в XML -документ. Обратите внимание, что к этому документу присоединена оригинальная версия таблицы стилей Raven.css , которая содержится в Листинге 7.5.

Документ включает три стандартных HTML -элемента.

Он содержит изображение, представленное следующим XML-элементом:

Этот элемент помещает стандартный HTML-элемент IMG (изображение). Атрибут HTML ALIGN=’LEFT’ делает изображение обтекаемым и размещает его слева от последующего текста документа. Этот метод является альтернативой методу, с которым вы познакомились ранее в разделе «Отобразите обтекаемое текстом изображение».

Этот элемент вставляет стандартный элемент HTML A (якорь).

Этот элемент вставляет стандартный элемент HTML HR (горизонтальная линия).

На рисунке 7.39 показано как Internet Explorer 5 отображает документ.

Создание и использование полноценной таблицы стилей

В последующих упражнениях вы создадите XML -документ, содержащий первые четыре строфы поэмы Эдгара По «Ворон». Затем вы создадите таблицу каскадных стилей, которая отформатирует этот документ с использованием почти всех свойств, рассмотренных в этой лекции. На рисунке 7.40 показано как поэма будет выглядеть в Internet Explorer 5.

Создайте документ

Откройте новый, пустой текстовый файл в вашем текстовом редакторе и введите XML-документ, представленный в Листинге 7.12.

Обратите внимание на следующие важные особенности документа Raven04.xml :

к нему присоединена таблица каскадных стилей Raven04.css, которую вы создадите в следующем упражнении;
перед каждым элементом STANZA расположен пустой элемент IMAGE . Вы используете элемент IMAGE для отображения рисунка ворона в начале каждой строфы;
последняя строка в каждой строфе помещена в специальный элемент с именем LASTVERSE . Это дает вам возможность форматировать последнюю строку отличным образом от остальных строк. (Она выровнена не по левому краю, а по правому.)