Ejemplo de Ver Archivo XML En HTML

Inicio » XML » Ver archivo XML en HTML

Para mostrar un XML usando HTML no es posible, para eso tenemos que usar algo de JavaScript, pero aún así es posible.

En este ejemplo mostraremos el Ejemplo de Catálogo de CD en XML, en una pagina HTML usando HTML y Javascript.

Lo primero que haremos será guardar el Ejemplo de Catálogo de CD en XML como catalogo.xml, y crear un archivo .html con el nombre que queramos, y le pondremos lo 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>

 

Y con este codigo, nos mostraría una tabla, con el titulo ARTISTA, y ALBUM, y luego los respectivos datos del XML. Podremos modificarlo, y agregar, editar, o eliminar, etc.

¿Cómo citar? Pichardo, A. (s.f.). Ejemplo de Ver Archivo XML En HTML.Ejemplo de. Recuperado el 26 de Septiembre de 2023 de https://www.ejemplode.com/21-xml/527-ejemplo_de_ver_archivo_xml_en_html.html

XML
Escrito por:
Aziel Pichardo
Ingeniería en Sistemas
Universidad del Estado de Guanajuato
Última modificación: 2009-01-29

Últimos 10 comentarios

  1. hola! disculpa, estoy queriendo leer y cargar varios archivos XML para poder hacer una búsqueda, aún no he logrado hacerlo, ojalá puedas proporcionarme un ejemplo.
    Por Nancy 2016-05-29 a las 4:48:56
  2. Muy buen ejemplo, serias tan amables de
    suministrarme el ejemplo para poder aplicarlo.
    Por Antonio Jesus 2012-05-05 a las 12:32:08
  3. Alguien me podria ayudar, antes podia ver una tabla, ahora con Win-7 me muestra el codigo.
    http://www.ecopetrol.com.co/xml_datagraph.aspx?gra_id=1&per_id=0

    Que tengo que hacer? gracias.
    MI email es oscint1@hotmail.com
    Por Oscar Integro 2012-02-04 a las 5:19:26
  4. caa sa ferfee re erer
    Por dddddd 2011-07-23 a las 1:34:06
  5. Miren ya revise el codigo tiene pequeños errores de sintaxis (Bueno solo los q yo he visto) hago el archvo xml pruebo el html y si me aparece la tabla, pero no me aparece los datos que tengo en el archivo xml.
    tal vez no estoi haciendo referencia correctamente; por fix ayudenme!!!!
    Gracias :)

    Por Mar 2011-01-18 a las 18:56:33
  6. Miren necesito hacer una página utilizando xhtml y xml;
    estoi utilizando dreamweber y inserte el codigo de arriva y no me hace nada.
    me podrian ayudar; plis!!!
    Por Mar 2011-01-18 a las 16:05:46
  7. En el chrome no me funciona, ¿tiene solución?
    Por Cristian 2010-12-27 a las 18:52:18
  8. Como hacer si el XML es uno que devuelve un WebService.
    Trate poniendo la ruta completa del webservice con todos sus parametros pero no pasa nada...
    Por Trucker 2010-12-07 a las 18:10:29
  9. no veo donde está el archivo xml, ¿por favor me ayudas?
    Por franklin 2010-07-28 a las 17:23:25
  10. lo voy a probar
    Por maximo 2010-04-30 a las 15:39:56

Deja un comentario


Acepto la política de privacidad.