Para visualizar un archivo xml en una pagina html se deb utilizar html y Javascript para lo cual se debe seguir los siguientes pasos:
1.Ingresar a la direccion /var/www/html para crear los archivos correspondientes de xml y html
2.Crear el archivo xml con el siguiente comando:
- gedit datos.xml
3. dentro del archivo datos.xml pegar el siguiente codigo:
<CATALOGO>
<CD>
<TITULO>Universidad Politecnica Salesiana</TITULO>
<ARTISTA>Katherine Ramos</ARTISTA>
<ORIGEN>AR</ORIGEN>
<PRECIO>5.90</PRECIO>
<ANO>2006</ANO>
</CD>
<CD>
<TITULO>La Lengua Popular</TITULO>
<ARTISTA>Andres Calamaro</ARTISTA>
<ORIGEN>AR</ORIGEN>
<PRECIO>9.90</PRECIO>
<ANO>2007</ANO>
</CD>
</CATALOGO>
<CD>
<TITULO>Universidad Politecnica Salesiana</TITULO>
<ARTISTA>Katherine Ramos</ARTISTA>
<ORIGEN>AR</ORIGEN>
<PRECIO>5.90</PRECIO>
<ANO>2006</ANO>
</CD>
<CD>
<TITULO>La Lengua Popular</TITULO>
<ARTISTA>Andres Calamaro</ARTISTA>
<ORIGEN>AR</ORIGEN>
<PRECIO>9.90</PRECIO>
<ANO>2007</ANO>
</CD>
</CATALOGO>
3.Crear archivo html con el siguiente código:
- gedit index.html
4.Dentro del archivo index ingresar el siguiente código:
<html>
<body>
<script type="text/javascript">
var xmlDoc=null;
if (window.ActiveXObject)
{// code for IE
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation.createDocument)
{// code for Mozilla, Firefox, Opera, etc.
xmlDoc=document.implementation.createDocument("","",null);
}
else
{
alert('Tu navegador no soporta esta funcion');
}
if (xmlDoc!=null)
{
xmlDoc.async=false;
xmlDoc.load("catalogo.xml");
var x=xmlDoc.getElementsByTagName("CD");
document.write("<table border='1'>");
document.write("<thead>");
document.write("<tr><th>Artista</th><th>Album</th></tr>");
document.write("</thead>");
document.write("<tfoot>");
document.write("<tr><th colspan='2'>Esta es mi coleccion de albums</th></tr>");
document.write("</tfoot>");
for (var i=0;i<x.length;i++)
{
document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("ARTISTA")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TITULO")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
document.write("</table>");
}
</script>
</body>
</html>
<body>
<script type="text/javascript">
var xmlDoc=null;
if (window.ActiveXObject)
{// code for IE
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation.createDocument)
{// code for Mozilla, Firefox, Opera, etc.
xmlDoc=document.implementation.createDocument("","",null);
}
else
{
alert('Tu navegador no soporta esta funcion');
}
if (xmlDoc!=null)
{
xmlDoc.async=false;
xmlDoc.load("catalogo.xml");
var x=xmlDoc.getElementsByTagName("CD");
document.write("<table border='1'>");
document.write("<thead>");
document.write("<tr><th>Artista</th><th>Album</th></tr>");
document.write("</thead>");
document.write("<tfoot>");
document.write("<tr><th colspan='2'>Esta es mi coleccion de albums</th></tr>");
document.write("</tfoot>");
for (var i=0;i<x.length;i++)
{
document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("ARTISTA")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TITULO")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
document.write("</table>");
}
</script>
</body>
</html>
5.Reinicar el servidor httpd para que se guarden los cambios efectuados:
6.Ingresar a localhost desde el navegador para visualizar los datos:
No hay comentarios:
Publicar un comentario