К Шарлин Хан

Чтобы просмотреть XML-данные как часть веб-страницы, вы можете использовать XSLT; браузеры не предоставляют эту возможность самостоятельно.

Такие читатели, как вы, помогают поддерживать MUO. Когда вы совершаете покупку по ссылкам на нашем сайте, мы можем получать партнерскую комиссию. Читать далее.

XML — это язык, используемый для структурирования, хранения и обмена данными. XSLT — это еще один язык, который позволяет преобразовывать данные XML в другие форматы, такие как HTML.

Вы можете использовать XSLT для отображения данных XML на веб-странице HTML. Использование XML и XSLT для отображения ваших данных может быть полезным, так как позволяет вам структурировать данные таким образом, чтобы это соответствовало вашим конкретным потребностям.

Как добавить пример данных в файл XML

Чтобы отобразить данные XML на веб-странице, сначала необходимо создать файл XML и добавить в него данные.

  1. Создайте новый файл с именем данные.xml.
  2. Внутри файла XML объявите кодировку и версию XML:
     1.0 UTF-8?>
  3. instagram viewer
  4. Свяжите файл XML с файлом таблицы стилей XSL, который вы создадите позже.
     текст/xsl xmlstylesheet.xsl?>
  5. Добавьте данные в файл XML. XML содержит структурированные данные и хранит каждую точку данных в отдельном теге. Этот пример включает корневой тег с именем игры. Внутри игры тег, храните каждую отдельную игру внутри своего собственного игра ярлык. Храните данные для каждой игры, такие как имя и разработчик в отдельных тегах.
     1.0 UTF-8?>
    текст/xsl xmlstylesheet.xsl?>
    <игры>
    <игра>
    <имя>Последний из нас, часть 2имя>
    <разработчик>Игривый щенокразработчик>
    игра>
    <игра>
    <имя>Призрак Цусимыимя>
    <разработчик>Sucker Punch Productionsразработчик>
    игра>
    <игра>
    <имя>Смертельная нитьимя>
    <разработчик>Кодзима Продакшнсразработчик>
    игра>
    игры>

Как использовать XSLT для чтения данных из XML-файла

Создайте новый файл XSL для циклического просмотра каждой точки данных на странице XML и отображения данных.

  1. В той же папке, что и ваш файл XML, создайте новый файл с именем xmlstylesheet.xsl.
  2. Внутри файла объявите версию XSL и добавьте базовую структуру тега XSL:
     1.0 UTF-8?>
    <xsl: таблица стилейверсия="1.0"xmlns: xsl=" http://www.w3.org/1999/XSL/Transform">
    // Ваш код здесь
    xsl: таблица стилей>
  3. Внутри основного тега XSL добавьте шаблон ярлык. Здесь вы можете добавить собственный HTML-код для отображения и оформления ваших XML-данных.
    <xsl: шаблонсоответствовать="/">
    <HTML>
    <тело>
    // Ваш HTML-код здесь
    тело>
    HTML>
    xsl: шаблон>
  4. Внутри тега body используйте xsl: для каждого селектор тегов. Это будет действовать как цикл for для перебора каждого игра тег, вложенный под игры ярлык.
    <xsl: для каждоговыбирать="игры/игра">

    xsl: для каждого>
  5. Внутри цикла for-each отобразите точки данных имени и разработчика, используя xsl: значение селектор тегов.
    <xsl: значениевыбирать="имя" />
    <xsl: значениевыбирать="разработчик" />

Как отображать данные на веб-странице HTML

Вы не сможете открыть файл XSLT или XML непосредственно в браузере, чтобы просмотреть данные как часть веб-страницы. Создайте новый файл HTML и визуализируйте данные с помощью iframe ярлык.

  1. В той же папке, что и файлы XML и XSL, создайте новый файл с именем index.html.
  2. Добавьте базовую структуру файла HTML. Если вы раньше не использовали HTML, вы можете освежить в памяти вводные концепции HTML.
    HTML>
    <HTML>
    <голова>
    <заголовок>Пример XML и XSLTзаголовок>
    голова>
    <тело>


    тело>
    HTML>
  3. Внутри тело тег, используйте iframe тег для ссылки на файл XML и файл XSL:
    <h1>Пример XML и XSLTh1>
    <п>Следующее содержимое генерируется из XML-файла:п>
    <iframeисточник="данные.xml"xslt="xmlstylesheet.xsl">iframe>
  4. Создайте новый файл с именем стили.css.
  5. Внутри файла добавьте CSS для оформления веб-страницы. Не стесняйтесь изменять свой CSS, используя другие интересные CSS советы и хитрости.
    HTML,
    тело {
    высота: 100%;
    маржа: 0;
    }

    тело {
    дисплей: гибкий;
    выравнивание содержимого: по центру;
    выравнивание элементов: по центру;
    flex-направление: столбец;
    }

    п {
    нижняя граница: 24px;
    }

  6. Свяжите свой HTML-файл со стилем CSS, добавив следующее в тег заголовка HTML.
    <связьотн.="таблица стилей"href="стили.css">
  7. Откройте файл HTML с помощью браузера, чтобы просмотреть данные XML. Некоторые браузеры не поддерживают XSLT, но некоторые браузеры, такие как Firefox, поддерживают.

Отображение данных на веб-страницах HTML

Существует множество способов отображения данных на веб-страницах HTML, XML и XSLT являются одними из них. Не стесняйтесь исследовать другие способы сделать это, такие как сохранение и отображение пользовательского ввода с помощью JavaScript.

Подписывайтесь на нашу новостную рассылку

Комментарии

ДелитьсяТвитнутьДелитьсяДелитьсяДелиться
Копировать
Электронная почта
Делиться
ДелитьсяТвитнутьДелитьсяДелитьсяДелиться
Копировать
Электронная почта

Ссылка скопирована в буфер обмена

Похожие темы

  • Программирование
  • HTML
  • CSS
  • Веб-разработка

Об авторе

Шарлин Хан (опубликовано 76 статей)

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