Чтобы просмотреть XML-данные как часть веб-страницы, вы можете использовать XSLT; браузеры не предоставляют эту возможность самостоятельно.
XML — это язык, используемый для структурирования, хранения и обмена данными. XSLT — это еще один язык, который позволяет преобразовывать данные XML в другие форматы, такие как HTML.
Вы можете использовать XSLT для отображения данных XML на веб-странице HTML. Использование XML и XSLT для отображения ваших данных может быть полезным, так как позволяет вам структурировать данные таким образом, чтобы это соответствовало вашим конкретным потребностям.
Как добавить пример данных в файл XML
Чтобы отобразить данные XML на веб-странице, сначала необходимо создать файл XML и добавить в него данные.
- Создайте новый файл с именем данные.xml.
- Внутри файла XML объявите кодировку и версию XML:
1.0 UTF-8?>
- Свяжите файл XML с файлом таблицы стилей XSL, который вы создадите позже.
текст/xsl xmlstylesheet.xsl?>
- Добавьте данные в файл XML. XML содержит структурированные данные и хранит каждую точку данных в отдельном теге. Этот пример включает корневой тег с именем игры. Внутри игры тег, храните каждую отдельную игру внутри своего собственного игра ярлык. Храните данные для каждой игры, такие как имя и разработчик в отдельных тегах.
1.0 UTF-8?>
текст/xsl xmlstylesheet.xsl?>
<игры>
<игра>
<имя>Последний из нас, часть 2имя>
<разработчик>Игривый щенокразработчик>
игра>
<игра>
<имя>Призрак Цусимыимя>
<разработчик>Sucker Punch Productionsразработчик>
игра>
<игра>
<имя>Смертельная нитьимя>
<разработчик>Кодзима Продакшнсразработчик>
игра>
игры>
Как использовать XSLT для чтения данных из XML-файла
Создайте новый файл XSL для циклического просмотра каждой точки данных на странице XML и отображения данных.
- В той же папке, что и ваш файл XML, создайте новый файл с именем xmlstylesheet.xsl.
- Внутри файла объявите версию XSL и добавьте базовую структуру тега XSL:
1.0 UTF-8?>
<xsl: таблица стилейверсия="1.0"xmlns: xsl=" http://www.w3.org/1999/XSL/Transform">
// Ваш код здесь
xsl: таблица стилей> - Внутри основного тега XSL добавьте шаблон ярлык. Здесь вы можете добавить собственный HTML-код для отображения и оформления ваших XML-данных.
<xsl: шаблонсоответствовать="/">
<HTML>
<тело>
// Ваш HTML-код здесь
тело>
HTML>
xsl: шаблон> - Внутри тега body используйте xsl: для каждого селектор тегов. Это будет действовать как цикл for для перебора каждого игра тег, вложенный под игры ярлык.
<xsl: для каждоговыбирать="игры/игра">
xsl: для каждого> - Внутри цикла for-each отобразите точки данных имени и разработчика, используя xsl: значение селектор тегов.
<xsl: значениевыбирать="имя" />
<xsl: значениевыбирать="разработчик" />
Как отображать данные на веб-странице HTML
Вы не сможете открыть файл XSLT или XML непосредственно в браузере, чтобы просмотреть данные как часть веб-страницы. Создайте новый файл HTML и визуализируйте данные с помощью iframe ярлык.
- В той же папке, что и файлы XML и XSL, создайте новый файл с именем index.html.
- Добавьте базовую структуру файла HTML. Если вы раньше не использовали HTML, вы можете освежить в памяти вводные концепции HTML.
HTML>
<HTML>
<голова>
<заголовок>Пример XML и XSLTзаголовок>
голова>
<тело>
тело>
HTML> - Внутри тело тег, используйте iframe тег для ссылки на файл XML и файл XSL:
<h1>Пример XML и XSLTh1>
<п>Следующее содержимое генерируется из XML-файла:п>
<iframeисточник="данные.xml"xslt="xmlstylesheet.xsl">iframe> - Создайте новый файл с именем стили.css.
- Внутри файла добавьте CSS для оформления веб-страницы. Не стесняйтесь изменять свой CSS, используя другие интересные CSS советы и хитрости.
HTML,
тело {
высота: 100%;
маржа: 0;
}тело {
дисплей: гибкий;
выравнивание содержимого: по центру;
выравнивание элементов: по центру;
flex-направление: столбец;
}п {
нижняя граница: 24px;
} - Свяжите свой HTML-файл со стилем CSS, добавив следующее в тег заголовка HTML.
<связьотн.="таблица стилей"href="стили.css">
- Откройте файл HTML с помощью браузера, чтобы просмотреть данные XML. Некоторые браузеры не поддерживают XSLT, но некоторые браузеры, такие как Firefox, поддерживают.
Отображение данных на веб-страницах HTML
Существует множество способов отображения данных на веб-страницах HTML, XML и XSLT являются одними из них. Не стесняйтесь исследовать другие способы сделать это, такие как сохранение и отображение пользовательского ввода с помощью JavaScript.