JavaScript - Duda sobre un ejercicio de javascript de Dom

Duda sobre un ejercicio de javascript de Dom

Publicado por javier (4 intervenciones) el 19/04/2022 16:27:47

Hola tengo un poblema con un ejercicio de javascript de dom. No entiendo como hacerlo por eso necesito a alguien que me ayude a comprender como hacerlo

Mi codigo
function gestionarFicheroXML(XmlDoc)
{

let CapaVacia = document.querySelector(".principal")
let pipo = XmlDoc.querySelectorAll("libreria")
let cadena = ""
for (let libreria of pipo)
{
cadena += "<h2>" + libreria.querySelector("libro").textContent + "</h2>"
cadena += "<table>"
let libros = libreria.querySelectorAll("libro")
for (let libro of libros)
{

cadena += "<tr><td>" + libro.querySelector("titulo").textContent + "</td>"
cadena += "<td>" + libro.querySelector("editorial").textContent + "</tr></tr>"
cadena += "<td>" + libro.querySelector("fechaPublicacion").textContent + "</td>"
cadena += "<td>" + libro.querySelector("paginaWeb").textContent + "</td>"
}
cadena += "</table>"

CapaVacia.innerHTML = cadena;

}
}

loadDocA("libros.xml");

El enunciado dice :Utilizando el xml de los libros aquí proporcionado realizar una
distribución de tabla usando display. Cada librería es una tabla diferente. Cada libro
aparece en una fila. El color de fondo de las celda cuyo libro sea más barato
aparecerá con un color de fondo. El conjunto de las tablas estará centrado tanto
vertical como horizontalmente.

Valora esta pregunta

Me gusta: Está pregunta es útil y esta clara

No me gusta: Está pregunta no esta clara o no es útil

Responder

Duda sobre un ejercicio de javascript de Dom

Publicado por Ivan (118 intervenciones) el 19/04/2022 20:38:27

Hola,

parece que tienes un ejercicio de los complicadillos.

Por un lado debes leer el archivo XML e ir desglosando cada elemento librería en una tabla, donde cada elemento libro es una fila de dicha tabla. Esto ya es bastante complicado, a groso modo puedes hacerlo así (pero falta pulirlo):

<!DOCTYPE html>

<html lang="es">

  <head>

    <title>Mis libros XML</title>

    <meta charset="utf-8">

  </head>

<body>

<h1>Mis libros</h1>

<button type="button" onclick="loadXMLDoc()">Obtener XML</button>

<p id="demo"></p>

<script>

function loadXMLDoc() {

  var xmlhttp = new XMLHttpRequest();

  xmlhttp.onreadystatechange = function() {

    if (this.readyState == 4 && this.status == 200) {

      myFunction(this);

};

  xmlhttp.open("GET", "libros.xml", true);

  xmlhttp.send();

function myFunction(xml) {

  var x, i, xmlDoc, txt;

  xmlDoc = xml.responseXML;

  txt = nName = "";

  x = xmlDoc.all;

  for (i = 0; i< x.length; i++) {

  // AQUÍ DEBES DETECTAR LOS ELEMENTOS Y DAR EL FORMATO DE TABLA

    txt += x[i].nodeName + ": ";

    txt += x[i].childNodes[0].nodeValue + "<br>";

  document.getElementById("demo").innerHTML = txt;

</script>

</body>

</html>

El primer problema es que sólo se aceptan peticiones http hacia el archivo libros.xml, así que debes instalarte un servidor local.
Aconsejo que uses el charset utf-8 en ambos archivos (xml y html) aunque tu xml ya está escrito en ISO.

Una vez puedas leer el XML entiendo que debes dar formato a la salida usando display, aquí interpreto que debes usar los comandos CSS display table y display table-cell, puedes encontrar información en https://www.w3schools.com/cssref/pr_class_display.asp

Espero que te sirva.

Un saludo!

Valora esta respuesta

Me gusta: Está respuesta es útil y esta clara

No me gusta: Está respuesta no esta clara o no es útil

Comentar