Foros aprenderaprogramar.com
Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: Dimitar Stefanov en 23 de Junio 2016, 23:26
-
Buenas noches.
Expongo una posible solución del ejercicio CU01210F del curso Ajax desde cero.
EJERCICIO
Considera el siguiente documento xml al que denominamos ejemplo.xml:
Código original XML:
<?xml version="1.0"?>
<catalog>
<book id="bk101">
<author>Gambardella, Matthew</author>
<title>XML Developer's Guide</title>
<price>44.95</price>
<publish_date>2000-10-01</publish_date>
</book>
<book id="bk102">
<author>Ralls, Kim</author>
<title>Midnight Rain</title>
<price>5.95</price>
<publish_date>2000-12-16</publish_date>
</book>
<book id="bk103">
<author>Corets, Eva</author>
<title>Maeve Ascendant</title>
<price>5.95</price>
<publish_date>2000-11-17</publish_date>
</book>
</catalog>
a) Transforma el archivo xml para que id en lugar de ser un atributo de etiqueta sea una etiqueta
Código XML:
<?xml version="1.0" ?>
<catalog>
<book>
<id>bk101</id>
<author>Gambardella, Matthew</author>
<title>XML Developer's Guide</title>
<price>44.95</price>
<publish_date>2000-10-01</publish_date>
</book>
<book>
<id>bk102</id>
<author>Ralls, Kim</author>
<title>Midnight Rain</title>
<price>5.95</price>
<publish_date>2000-12-16</publish_date>
</book>
<book>
<id>bk103</id>
<author>Corets, Eva</author>
<title>Maeve Ascendant</title>
<price>5.95</price>
<publish_date>2000-11-17</publish_date>
</book>
</catalog>
b) Crea un archivo html que permita elegir el título (title) y dinámicamente recupere desde el archivo xml el contenido de todas las demás etiquetas incluido el id y los muestre por pantalla.
Código HTML:
<!DOCTYPE html>
<html>
<head>
<title>Cursos aprende a programar</title>
<meta charset="utf-8">
<style type="text/css">
*{
font-family:sans-serif;
}
a:link{
text-decoration:none;
}
select{
font-size:18px;
}
div div{
color: blue;
background-color:#F1FEC6;
font-size: 20px;
float: left;
border: solid;
margin: 20px;
padding:15px;
}
</style>
<script>
function mostrarSugerencia(str){
var libroElegido='';
if(str=='bk101'){
libroElegido='bk101';
}else if(str=='bk102'){
libroElegido='bk102';
}else if(str=='bk103'){
libroElegido='bk103';
}else{
libroElegido='none';
}
var xmlhttp;
if(str.length==0 ||libroElegido=='none'){
document.getElementById("txtInformacion").innerHTML="no hay datos";
return;
}
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
var xmlDoc = xmlhttp.responseXML;
librosRecibidos = obtenerArrayNodosPorTag(xmlDoc, 'book');
for(var i=0; i<librosRecibidos.length;i++){
var tituloLibro = obtenerArrayNodosPorTag(librosRecibidos[i], 'title')[0].innerHTML;
var autorLibro = obtenerArrayNodosPorTag(librosRecibidos[i], 'author')[0].innerHTML;
var precioLibro = obtenerArrayNodosPorTag(librosRecibidos[i], 'price')[0].innerHTML;
var publicacionLibro = obtenerArrayNodosPorTag(librosRecibidos[i], 'publish_date')[0].innerHTML;
var idLibro = obtenerArrayNodosPorTag(librosRecibidos[i], 'id')[0].innerHTML;
if(idLibro==libroElegido){
document.getElementById("txtInformacion").innerHTML = 'El libro recibido por get en segundo plano es '+tituloLibro+ ' y tiene id '+idLibro+'. Su autor es '+autorLibro+', cuesta '+precioLibro+' y está publicado '+publicacionLibro;
}
}
}
}
xmlhttp.open("GET","CU01210F(01).xml");
xmlhttp.send();
}
function obtenerArrayNodosPorTag(nodoRaiz, nombreTag){
var arrayNodos = nodoRaiz.getElementsByTagName(nombreTag);
return arrayNodos;
}
</script>
</head>
<body style="margin:20px;">
<h2>Elige un país:</h2>
<form action="">
<select onchange="mostrarSugerencia(this.value)">
<option value="none">Elige</option>
<option value="bk101">XML Developer's Guide</option>
<option value="bk102">Midnight Rain</option>
<option value="bk103">Maeve Ascendant</option>
</select>
</form>
<br/>
<p>Informacion sobre operacion en segundo plano con Ajax: <span style="color:brown;" id="txtInformacion"></span></p>
</body>
</html>
Gracias.
-
Hola!
Todo bien, te has despistado en Elige un país: ya que estás trabajando con libros no con países :)
Saludos!