Архитектура Аудит Военная наука Иностранные языки Медицина Металлургия Метрология
Образование Политология Производство Психология Стандартизация Технологии


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



 

При сцеплении HTML элемента с XML-элементом, HTML-элемент автоматически отображает содержимое XML-элемента. Например, следующий элемент <SPAN> на HTML-странице сцеплен (атрибут DATASRC) с элементом AUTHOR (атрибут DATAFLD) связанного XML-документа:

 

<SPAN DATASRC="#dsoInventory" DATAFLD="AUTHOR"> </SPAN>

 

В результате HTML-элемент <SPAN> отображает содержимое XML-элемента AUTHOR.

Тег <SPAN> предназначен для определения строчных элементов документа.  C помощью тега  <SPAN>  можно выделить часть информации внутри других тегов и установить для нее свой стиль.

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

1. Табличное сцепление.

2. Сцепление по отдельным записям.

 

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

 

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

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

Пример HTML-страницы, которая содержит таблицу, сцепленную с данными документа Inventory.xml:

 

<!-- Имя файла: Inventory Table.htm -->

<HTML>

<HEAD> <TITLE> Book Description </TITLE> </HEAD>

<BODY>

<XML ID="dsoInventory" SRC="Inventory.xml"></XML>

<H2> Book Inventory </H2>

<TABLE DATASRC="#dsoInventory" BORDER="1" CELLPADDING="5">

<THEAD>

<TH> TITLE </TH> <TH> AUTHOR </TH> <TH> BINDING </TH>

<TH> PAGES </TH> <TH> PRICE </TH>

</THEAD>

<TR ALIGN="center">

<TD>

<SPAN DATAFLD="TITLE" STYLE="font-style:italic"> </SPAN>

</TD>

<TD><SPAN DATAFLD="AUTHOR"></SPAN></TD>

<TD><SPAN DATAFLD="BINDING"></SPAN></TD>

<TD><SPAN DATAFLD="PAGES"></SPAN></TD>

<TD><SPAN DATAFLD="PRICE"></SPAN></TD>

</TR>

</TABLE>

</BODY>

</HTML>

 

XML-документ Inventory.xml связан с HTML-страницей Table.htm   посредством фрагмента данных на этой странице, имеющего ID dsoInventory .

Элемент <TABLE> HTML-страницы сцеплен со всем XML-документом Inventory . xml путем присвоения атрибуту  DATASRC элемента идентификатора ID фрагмента данных, предваренного символом #.

Таблица определена со стандартным заголовком (элемент THEAD) и с одной строкой (элемент TR). Каждая ячейка в этой строке (т.е., каждый элемент TD) состоит из элемента SPAN, который сцеплен с одним из полей XML-документа таким образом, что этот элемент отображает содержимое поля. Например, первая ячейка содержит элемент SPAN, сцепленный с полем TITLE. Элемент SPAN связывается с полем XML путем присвоения имени поля (в данном примере TITLE) атрибуту DATAFLD элемента.

Даже если в элементе TABLE определена только одна строка, то когда браузер отображает таблицу, он повторяет строковый элемент для каждой записи в XML-документе. Т.е., в первой строке, следующей за заголовком, отображены поля (TITLE, AUTHOR и т.д.), принадлежащие первой записи (элемент BOOK для книги Adventures of Huckleberry Finn). В следующей строке отображены поля для второй записи (элемент BOOK для книги Leaves of Grass) и т.д. На рисунке 3.1 показано как выглядит документ в Internet Explorer 5.

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

 

 

Рис. 3.1 – Отображение XML - документа в Internet Explorer 5

 

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

1) Установить для атрибута DATAPAGESIZE сцепленного элемента TABLE значение, равное максимальному числу записей, которые нужно отобразить за один раз. Каждая страница записей будет содержать заданное вами число записей.

Например, следующий начальный тег для элемента TABLE присваивает число "5" атрибуту DATAPAGESIZE, в результате чего в таблице будет отображено пять записей за раз:

 

<TABLE DATASRC="# dsoInventory" DATAPAGESIZE="5">

 

Присвойте уникальный идентификатор атрибуту ID элемента TABLE, как для следующего начального тега:

 

<TABLE ID="InventoryTable" DATASRC="#dsoInventory"

DATAPAGESIZE="5">

 

2) Чтобы перемещаться между записями, нужно вызывать методы элемента TABLE, приведенные в таблице 3.1. Для приведенных в последнем столбце примеров предполагается, что таблица имеет идентификатор InventoryTable, т.е. TABLE ID="InventoryTable".

 

Таблица 3.1

 

Метод элемента TABLE Эффект Пример вызова
First Page Отображает первую страницу записей InventoryTable.firstPage()
Previous Page Отображает предыдущую страницу записей InventoryTable.previousPage()
Next Page Отображает следующую страницу записей InventoryTable.nextPage()
lastPage Отображает последнюю страницу записей InventoryTable.lastPage()

 

Если в текущий момент отображена первая страница, вызов метода previousPage игнорируется, а если отображена последняя страница, то игнорируется вызов nextPage.

Можно вызвать любой из этих методов из написанного вами сценария. Однако наиболее простой способ обращения к одному из методов заключается в присвоении метода атрибуту ONCLICK   HTML-элемента BUTTON, как в следующем примере:

 

<BUTTON ONCLICK="InventoryTable.nextPage()"> Next Page </BUTTON>

 

Этот элемент отображает кнопку. Когда пользователь щелкает на кнопке, вызывается метод, присвоенный атрибуту ONCLICK, а именно, InventoryTable . nextPage ().

Техника использования постраничного вывода демонстрируется в файлах Big . xml и  Big _ Table . htm. Файл Big _ Table . htm  представляет собой HTML-страницу, которая отображает XML-документ (Big . xml) в таблице, атрибуту DATAPAGESIZE которой присвоено значение "5". В верхней части страницы имеется четыре элемента BUTTON, каждый из которых выполняет действие в соответствии с методами постраничного вывода таблицы. Когда открывается HTML-страница, в таблице отображаются первые пять записей. Щелчок мышью на кнопке Next Page приводит к отображению следующих пяти записей (или, в конце таблицы, оставшегося числа записей), а щелчок на кнопке Previous приводит к отображению предыдущих пяти записей (или, в начале таблицы, первых пяти записей). Щелчок на кнопке  First Page или на кнопке  Last Page  приводит к отображению первых или последних пяти записей. На рисунке 3.2 показано как HTML-страница будет выглядеть в Internet Explorer.

 

 

Рис. 3.2. - Вид файла Big_Table.htm в Internet Explorer 

 

Содержание файла Big.xml:

 

<?xml version="1.0" encoding="windows-1251" ?>

<!-- Имя файла: Big.xml -->

<INVENTORY>

<BOOK>

<TITLE> The Adventures of Huckleberry Finn </TITLE>

<AUTHOR> Mark Twain </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 298 </PAGES>

<PRICE> $5.49 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Adventures of Tom Sawyer </TITLE>

<AUTHOR> Mark Twain </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 205 </PAGES>

<PRICE> $4.75 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Ambassadors </TITLE>

<AUTHOR> Henry James </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 305 </PAGES>

<PRICE> $5.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Awakening </TITLE>

<AUTHOR> Kate Chopin </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 195 </PAGES>

<PRICE> $4.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> Billy Budd </TITLE>

<AUTHOR> Herman Melville </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 195 </PAGES>

<PRICE> $4.49 </PRICE>

</BOOK>

<BOOK>

<TITLE> A Connecticut Yankee in King Arthur's Court  </TITLE>

<AUTHOR> Mark Twain </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 385 </PAGES>

<PRICE> $5.49 </PRICE>

</BOOK>

<BOOK>

<TITLE> Joan of Arc </TITLE>

<AUTHOR> Mark Twain </AUTHOR>

<BINDING> trade paperback </BINDING>

<PAGES> 465 </PAGES>

<PRICE> $6.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> Leaves of Grass </TITLE>

<AUTHOR> Walt Whitman </AUTHOR>

<BINDING> hardcover </BINDING>

<PAGES> 462 </PAGES>

<PRICE> $7.75 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Legend of Sleepy Hollow </TITLE>

<AUTHOR> Washington Irving </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 98 </PAGES>

<PRICE> $2.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Marble Faun </TITLE>

<AUTHOR> Nathaniel Hawthorne </AUTHOR>

<BINDING> trade paperback </BINDING>

<PAGES> 473 </PAGES>

<PRICE> $10.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> Moby-Dick </TITLE>

<AUTHOR> Herman Melville </AUTHOR>

<BINDING> hardcover </BINDING>

<PAGES> 724 </PAGES>

<PRICE> $9.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> Passing </TITLE>

<AUTHOR> Nella Larsen </AUTHOR>

<BINDING> trade paperback </BINDING>

<PAGES> 165 </PAGES>

<PRICE> $5.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Portrait of a Lady </TITLE>

<AUTHOR> Henry James </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 256 </PAGES>

<PRICE> $4.95 </PRICE>

</BOOK>

<BOOK>

<TITLE> Roughing It </TITLE>

<AUTHOR> Mark Twain </AUTHOR>

<BINDING> mass market paperback </BINDING>

<PAGES> 324 </PAGES>

<PRICE> $5.25 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Scarlet Letter </TITLE>

<AUTHOR> Nathaniel Hawthorne </AUTHOR>

<BINDING> trade paperback </BINDING>

<PAGES> 253 </PAGES>

<PRICE> $4.25 </PRICE>

</BOOK>

<BOOK>

<TITLE> The Turn of the Screw </TITLE>

<AUTHOR> Henry James </AUTHOR>

<BINDING> trade paperback </BINDING>

<PAGES> 384 </PAGES>

<PRICE> $3.35 </PRICE>

</BOOK>

</INVENTORY>

 

Файл Big_Table.htm:

 

<!-- Имя файла: Big_Table.htm -->

<HTML>

<HEAD> <TITLE> Book Inventory </TITLE> </HEAD>

<BODY>

<XML ID="dsoBig " SRC="Big.xml"></XML>

<H2> Book Inventory </H2>

<BUTTON ONCLICK="InventoryTable.firstPage()">

|&lt; First Page

</BUTTON>

&nbsp;&nbsp;

<BUTTON ONCLICK="InventoryTable.previousPage()">

&lt; Previous Page

</BUTTON>

&nbsp;&nbsp;

<BUTTON ONCLICK="InventoryTable.nextPage()">

Next Page &gt;

</BUTTON>

&nbsp;&nbsp;

<BUTTON ONCLICK="InventoryTable.lastPage()">

Last Page &gt;|

</BUTTON>

<p>

<TABLE ID="InventoryTable" DATASRC="#dsoInventory"

DATAPAGESIZE="5" BORDER="1" CELLPADDING="5">

<THEAD>

    <TH> Title </TH>

    <TH> Author </TH>

    <TH> Binding </TH>

    <TH> Pages </TH>

    <TH> Price </TH>

</THEAD>    

<TR ALIGN="center">

    <TD><SPAN DATAFLD="TITLE"

       STYLE="font-style:italic"></SPAN></TD>

    <TD><SPAN DATAFLD="AUTHOR"></SPAN></TD>

    <TD><SPAN DATAFLD="BINDING"></SPAN></TD>

    <TD><SPAN DATAFLD="PAGES"></SPAN></TD>

    <TD><SPAN DATAFLD="PRICE"></SPAN></TD>

</TR>

</TABLE>

</BODY>

</HTML>

 


Поделиться:



Последнее изменение этой страницы: 2019-05-08; Просмотров: 466; Нарушение авторского права страницы


lektsia.com 2007 - 2024 год. Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав! (0.108 с.)
Главная | Случайная страница | Обратная связь