НОУ ИНТУИТ | Основы XML. Лекция 9: Отображение XML-документов с использованием сценариев объектной модели документа

Учитесь и получайте официальные документы БЕСПЛАТНО. Вы можете поддержать наш проект.

Регистрация Вход

Твой путь к знаниям!

Опубликован: 24.01.2007 | Доступ: свободный | Студентов: 9682 / 1719 | Оценка: 4.28 / 4.09 | Длительность: 20:51:00

Темы: Интернет-технологии, Программирование

Специальности: Программист, Разработчик интернет-проектов

|

Вам нравится? Нравится 67 студентам

| Поделиться |

Поддержать курс

| Скачать электронную книгу

Извлечение символьных данных элемента

В сценарии, представленном в Листинге 9.3, свойство text каждого из дочерних элементов ( TITLE, AUTHOR, BINDING, PAGES и PRICE ) используется для получения символьных данных элемента. Например, следующий оператор используется для извлечения символьных данных элемента TITLE:

title.innerText=
  Document.documentElement.childNodes(0).text;

Свойство text показывает содержимое элемента в текущем узле, плюс текстовое содержимое любого подчиненного элемента. Оно хорошо подходит для извлечения символьных данных элемента в том случае, если элемент не имеет дочерних элементов (например, элемент TITLE ). Однако если элемент содержит один или более дочерних элементов помимо символьных данных, как в приведенном ниже примере, свойство text возвращает весь текст (в данном случае, "Moby-Dick Or, the Whale").

<TITLE>Moby-Dick
  <SUBTITLE>Or, the Whale</SUBTITLE>
</TITLE>

Чтобы получить только символьные данные элемента TITLE, вам потребуется осуществить доступ к дочернему узлу Text.

Как видно из таблицы 9.1, свойство nodeValue узла Element имеет значение null. Если элемент содержит символьные данные, то они хранятся в дочернем узле Text, и вы можете получить их через свойство nodeValue узла Text. Например, чтобы получить данные элемента TITLE ("Moby-Dick"), из предыдущего примера, без символьных данных, принадлежащих элементу SUBTITLE, используем следующее выражение:

Element.firstChild.nodeValue

(Поскольку символьные данные элемента TITLE предшествуют подчиненному элементу, они представляются первым дочерним узлом, и вы можете извлечь их с помощью свойства firstChild.)

Если символьные данные элемента смешаны с дочерними элементами, комментариями или инструкциями по обработке, каждый отдельный блок символьных данных представляется собственным дочерним узлом Text. Например, приведенный ниже элемент ITEM имеет три дочерних узла, расположенных в следующем порядке: узел Text, представляющий первый блок символьных данных; узел ELEMENT, представляющий дочерний элемент SUB-ITEM ; еще один узел Text, представляющий второй блок символьных данных:

<ITEM>
  блок символьных данных № 1 /* узел Text */
  <SUB-ITEM>текст подчиненного элемента</SUB-ITEM>
    блок символьных данных № 2 /* узел Text */
</ITEM>

Метод и свойство, предоставляемые узлом Text, приведены в таблице 9.5.

Таблица 9.5. Полезные свойство и метод, поддерживаемые узлами Text. Другие доступные свойства вы можете найти в перечне общих свойств в таблице 9.2
Свойство узла Text	Описание	Пример
length	Количество символов в тексте узла	CharacterCount = Text.length;
Метод узла Text	Описание	Пример
substringData(char-offset, num-chars)	Возвращает строку, содержащую заданное число символов из текстового содержимого узла, начиная с указанной параметром смещения позиции	Substring = Text.substringData(2, 3); (Возвращает третий, четвертый и пятый символы из содержимого элемента Text)

Отображение переменного числа XML-элементов

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

Например, для XML-документа типа Inventory.xml (см. Листинг 8.1) или Inventory Big.xml (см. Листинг 8.3) вы обычно не знаете заранее, сколько элементов BOOK содержит документ. Если же количество элементов BOOK меняется, необходимо воспользоваться сценарием.

В Листинге 9.4 представлена HTML-страница, которая использует DOM для отображения документа Inventory.xml вне зависимости от того, сколько элементов BOOK в нем содержится. На рисунке 9.3 показано как будет выглядеть страница в Internet Explorer 5.

Рис. 9.3.

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

<HTML>

<HEAD>

   <TITLE>Book Inventory</TITLE>

   <SCRIPT LANGUAGE="JavaScript" FOR="window" EVENT="ONLOAD">
      HTMLCode = "";
      Document = dsoInventory.XMLDocument;      

      for (i=0; 
           i < Document.documentElement.childNodes.length; 
           i++)
      {
      HTMLCode += 
      "<SPAN STYLE='font-style:italic'>Title: </SPAN>"
      + Document.documentElement.childNodes(i).childNodes(0).text 
      + "<BR>"
      + "<SPAN STYLE='font-style:italic'>Author: </SPAN>"
      + Document.documentElement.childNodes(i).childNodes(1).text 
      + "<BR>"
      + "<SPAN STYLE='font-style:italic'>Binding: </SPAN>"
      + Document.documentElement.childNodes(i).childNodes(2).text 
      + "<BR>"
      + "<SPAN STYLE='font-style:italic'>Number of pages: "
      + "</SPAN>"
      + Document.documentElement.childNodes(i).childNodes(3).text 
      + "<BR>"
      + "<SPAN STYLE='font-style:italic'>Price: </SPAN>"
      + Document.documentElement.childNodes(i).childNodes(4).text 
      + "<P>";
      }
         
      DisplayDIV.innerHTML=HTMLCode;         
   </SCRIPT>
   
</HEAD>

<BODY>

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

   <H2>Book Inventory</H2>
   
   <DIV ID="DisplayDIV"></DIV>

</BODY>

</HTML>

Листинг 9.4. DomDemo Variable.htm

Сценарий в рассматриваемом примере использует свойство length для определения количества элементов BOOK внутри корневого элемента. (Свойство length является членом группового объекта NodeList, предоставляемого свойством childNodes узла корневого элемента. См. таблицу 9.4.) В сценарии имеется цикл for, который выполняется для каждого элемента BOOK и включает код для отображения каждого из этих элементов:

for (i=0;
  i < Document.documentElement.childNodes.length;
  i++)
  {
  /* код для отображения элемента BOOK… */
  }

Поскольку количество элементов BOOK неизвестно, страница не может использовать фиксированный набор элементов SPAN в разделе BODY для отображения данных (как это делалось в предыдущем примере из Листинга 9.3). Вместо этого для каждого элемента BOOK сценарий динамически генерирует весь блок HTML-разметки, необходимый для отображения элемента:

for (i=0;
  i < Document.documentElement.childNodes.length;
  i++)
{
HTMLCode +=
"<SPAN STYLE='font-style:italic'>Title: </SPAN>"
+ Document.documentElement.childNodes(i).childNodes(0).text
+ "<BR>"
+ "<SPAN STYLE='font-style:italic'>Author: </SPAN>"
+ Document.documentElement.childNodes(i).childNodes(1).text
+ "<BR>"
+ "<SPAN STYLE='font-style:italic'>Binding: </SPAN>"
+ Document.documentElement.childNodes(i).childNodes(2).text
+ "<BR>"
+ "<SPAN STYLE='font-style:italic'>Number of pages: "
+ "</SPAN>"
+ Document.documentElement.childNodes(i).childNodes(3).text
+ "<BR>"
+ "<SPAN STYLE='font-style:italic'>Price: </SPAN>"
+ Document.documentElement.childNodes(i).childNodes(4).text
+ "<P>";
}

Сценарий хранит все эти блоки HTML-разметки в переменной HTMLCode. После цикла for, когда все блоки сгенерированы и загружены в HTMLCode, сценарий присваивает HTML-разметку свойству innerHTML элемента DIV раздела BODY страницы (этот элемент имеет ID DisplayDIV ):

DisplayDIV.innerHTML=HTMLCode;

Элемент DIV затем сразу же получает HTML-разметку и отображает результаты, которые представлены на рисунке 9.3.

Чтобы убедиться, что страница работала независимо от количества элементов BOOK, которое содержится в XML-документе, вы можете отредактировать фрагмент данных на этой странице, чтобы он отображал документ Inventory Big.xml, который содержит в два раза больше элементов BOOK, чем документ Inventory.xml:

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

Дальше >>

Авторизоваться

Основы XML

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

Извлечение символьных данных элемента

Отображение переменного числа XML-элементов

Вопросы и ответы