Para ver datos XML como parte de una página web, puede utilizar XSLT; los navegadores no brindan esta capacidad por sí solos.
XML es un lenguaje utilizado para estructurar, almacenar e intercambiar datos. XSLT es otro lenguaje que le permite transformar sus datos XML en otros formatos, como HTML.
Puede usar XSLT para mostrar datos XML en una página web HTML. El uso de XML y XSLT para mostrar sus datos puede ser útil, ya que le permite estructurar los datos de una manera que tenga sentido para sus necesidades específicas.
Cómo agregar datos de ejemplo a un archivo XML
Para mostrar datos XML en una página web, primero debe crear el archivo XML y agregarle datos.
- Crear un nuevo archivo llamado datos.xml.
- Dentro del archivo XML, declara la codificación y la versión XML:
1.0 UTF-8?> - Vincule el archivo XML a un archivo de hoja de estilos XSL, que creará en un paso posterior.
texto/xsl xmlstylesheet.xsl?> - Agregue datos al archivo XML. XML contiene datos estructurados y almacena cada punto de datos en una etiqueta separada. Este ejemplo incluye una etiqueta raíz llamada juegos. Dentro de juegos etiqueta, almacena cada juego individual dentro de su propio juego etiqueta. Almacene datos para cada juego, como el nombre y desarrollador en etiquetas separadas.
1.0 UTF-8?>
texto/xsl xmlstylesheet.xsl?>
<juegos>
<juego>
<nombre>El último de nosotros Parte IInombre>
<desarrollador>perro traviesodesarrollador>
juego>
<juego>
<nombre>Fantasma de Tsushimanombre>
<desarrollador>Producciones Sucker Punchdesarrollador>
juego>
<juego>
<nombre>varada de la muertenombre>
<desarrollador>Producciones Kojimadesarrollador>
juego>
juegos>
Cómo usar XSLT para leer datos del archivo XML
Cree un nuevo archivo XSL para recorrer cada punto de datos en la página XML y mostrar los datos.
- En la misma carpeta que su archivo XML, cree un nuevo archivo llamado xmlstylesheet.xsl.
- Dentro del archivo, declare la versión XSL y agregue la estructura básica de la etiqueta XSL:
1.0 UTF-8?>
<xsl: hoja de estiloversión="1.0"xmlns: xsl=" http://www.w3.org/1999/XSL/Transform">
// Tu código aquí
xsl: hoja de estilo> - Dentro de la etiqueta XSL principal, agregue un plantilla etiqueta. Aquí es donde puede agregar código HTML personalizado para mostrar y diseñar sus datos XML.
<xsl: plantillafósforo="/">
<html>
<cuerpo>
// Su código HTML aquí
cuerpo>
html>
xsl: plantilla> - Dentro de la etiqueta del cuerpo, use el xsl: para cada uno seleccionador de etiquetas Esto actuará como un bucle for para recorrer cada juego etiqueta anidada debajo de la juegos etiqueta.
<xsl: para cada unoseleccionar="juegos/juego">
xsl: para cada uno> - Dentro del ciclo for-each, muestre el nombre y los puntos de datos del desarrollador, usando el xsl: valor de seleccionador de etiquetas
<xsl: valor deseleccionar="nombre" />
<xsl: valor deseleccionar="desarrollador" />
Cómo mostrar datos en una página web HTML
No podrá abrir el archivo XSLT o XML directamente en el navegador para ver los datos como parte de una página web. Cree un nuevo archivo HTML y renderice los datos usando un marco flotante etiqueta.
- En la misma carpeta que sus archivos XML y XSL, cree un nuevo archivo llamado índice.html.
- Agregue la estructura básica de un archivo HTML. Si no ha usado HTML antes, puede repasar conceptos introductorios de HTML.
html>
<html>
<cabeza>
<título>Ejemplo de XML y XSLTtítulo>
cabeza>
<cuerpo>
cuerpo>
html> - Dentro de cuerpo etiqueta, usa una marco flotante etiqueta para vincular al archivo XML y al archivo XSL:
<h1>Ejemplo de XML y XSLTh1>
<pag>El siguiente contenido se genera a partir de un archivo XML:pag>
<marco flotanteorigen="datos.xml"xslt="xmlstylesheet.xsl">marco flotante> - Crear un nuevo archivo llamado estilos.css.
- Dentro del archivo, agregue algo de CSS para diseñar su página web. Siéntase libre de modificar su CSS usando otros interesantes Consejos y trucos de CSS.
html,
cuerpo {
altura: 100%;
margen: 0;
}cuerpo {
pantalla: flexible;
justificar-contenido: centro;
alinear elementos: centro;
dirección de flexión: columna;
}pag {
margen inferior: 24px;
} - Vincule su archivo HTML al estilo CSS agregando lo siguiente a la etiqueta de encabezado HTML.
<enlacereal="hoja de estilo"href="estilos.css"> - Abra su archivo HTML usando un navegador para ver sus datos XML. Algunos navegadores no son compatibles con XSLT, pero algunos navegadores como Firefox sí lo son.
Mostrar datos en páginas web HTML
Hay muchas formas de mostrar datos en páginas web HTML, XML y XSLT son una de ellas. Siéntase libre de explorar las otras formas en que puede hacer esto, como almacenar y mostrar la entrada del usuario usando JavaScript.
