Hola, muy buenas a todos.
Vereis, tengo un problemilla xD.
Hace poco que he empezado a programar en javascript, y me gustaria hacer una pagina web que sea un test de autoescuela, pero que lea las preguntas desde un XML. He conseguido que me muestre las preguntas por pantalla, pero lo hace sin formato, es decir, como si de un bloc de notas se tratara.
No se como hacer para poner el formato a las preguntas XML, para que me salgan en una tabla con inputs radio y todo esas cosas, asi como hacer las funciones para que me hagan la cuenta de las preguntas.
He mirado ejemplos por internet, pero estoy demasiado perdido.
Si me ayudarais, os estaría muy agradecidos.
Este es el codigo que he hecho hasta ahora.
-- CODIGO XHTML --
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Autoescuela BMG</title>
<link href="CodigoCSS.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
alert("Bienvenido a Autoescuela BMG");
var name = prompt("Por favor, antes de empezar introduce tu nombre:", " ");
function cargar() {
var DocumentoXml = new ActiveXObject("Microsoft.XMLDOM");
DocumentoXml.async = false; // Sólo sirve para trabajar con Internet Explorer.
DocumentoXml.load("Preguntas.xml"); // Carga del archivo XML.
var estado = DocumentoXml.readyState;
var errorcin = DocumentoXml.parseError;
if (errorcin.errorCode == 0) {
raiz = DocumentoXml.documentElement;
for (i = 0; i < raiz.childNodes.length; i++) {
var dato = raiz.childNodes.item(i).text
document.write("Pregunta: " + dato);
document.write("</br>")
}
}
}
</script>
</head>
<body>
<div id="container">
<div id="cabecera">
<h1>Autoescuela BMG</h1>
</div>
<div class="contenido">
<div id="imagen_cabecera"></div>
<p>Esta página web ha sido realizada en lenguaje JavaScript, XHTML, CSS y XML. Su funcionamiento es el siguiente:</p>
<p>Las preguntas contenidas en el test se muestran a partir de un archivo externo XML, especializado en la gestión de información para web.
Una vez contestadas todas las preguntas, mediante el botón situado al final del test se puede realizar una autocorrección usando el lenguaje
JavaScript. Además de esto, el código presenta dos particularidades:</p>
<p>Por un lado, el mismo código presenta, una vez realizada la corrección, un listado de las preguntas y las respuestas seleccionadas por
el usuario seguidas de las respuestas correctas.<br />
Por otro lado, se muestra el número de preguntas acertadas.</p>
<p>Para terminar, mencionar que para dar estética a la página, se han usado hojas de estilo CSS, todo sobre XHTML, dedicado exclusivamente
a la presentación de información.</p>
<br />
<input id="Button1" type="button" value="Realizar Test" onclick="cargar()"; style="font-family: 'Copperplate Gothic Bold';
font-size: large; color: #0c6387; text-transform: capitalize; font-variant: normal; font-style: normal; font-weight: normal;
background-color: #012d3f; margin:0px 0px 0px 280px;"
/>
<hr align="center" />
</div>
</div>
</body>
</html>
Código:
-- CODIGO XML --
<?xml version="1.0" encoding="utf-8" ?>
<?xml-stylesheet type="text/css" href="CodigoCSS.css"?>
<Titulo>
<Pregunta>
<OpcionA></OpcionA>
<OpcionB></OpcionB>
<OpcionC></OpcionC>
</Pregunta>
<Pregunta>
<OpcionA></OpcionA>
<OpcionB></OpcionB>
<OpcionC></OpcionC>
</Pregunta>
</Titulo>