quiz6.html

  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <meta charset="UTF-8">
  4. <title>Quiz 6</title>
  5. <script src="quiz.js"></script>
  6. <link href="quiz.css" rel="Stylesheet">
  7.  
  8. let section = null;
  9. let article = null;
  10. let numPregunta = 0;
  11. let numRespuesta = 0;
  12.  
  13. function paginaCargada() {
  14. section = document.querySelector("#quiz");
  15. agregarTodasPreguntas();
  16. }
  17.  
  18. function agregarTodasPreguntas() {
  19. numPregunta = 1;
  20. for (const item of datos) {
  21. agregarArticulo(item);
  22. numPregunta++;
  23. }
  24. }
  25.  
  26. function agregarArticulo(item) {
  27. article = document.createElement('article');
  28. agregarPregunta(item.pregunta);
  29. agregarRespuestasPregunta(item.respuestas);
  30. section.appendChild(article);
  31. }
  32.  
  33. function agregarPregunta(pregunta) {
  34. const h2 = document.createElement('h2');
  35. h2.textContent = pregunta;
  36. article.appendChild(h2);
  37. }
  38.  
  39. function agregarRespuestasPregunta(respuestas) {
  40. numRespuesta = 1;
  41. for (const respuesta of respuestas) {
  42. agregarRespuesta(respuesta);
  43. numRespuesta++;
  44. }
  45. }
  46.  
  47. function agregarRespuesta(respuesta) {
  48. const p = document.createElement('p');
  49. const label = document.createElement('label');
  50. label.appendChild(crearInputRadio());
  51. label.appendChild(document.createTextNode(respuesta));
  52. p.appendChild(label);
  53. article.appendChild(p);
  54. }
  55.  
  56. function crearInputRadio() {
  57. const input = document.createElement('input');
  58. input.setAttribute('type', 'radio');
  59. input.setAttribute('name', 'pregunta'+numPregunta);
  60. input.setAttribute('value', numRespuesta);
  61. return input;
  62. }
  63.  
  64.  
  65. </script>
  66. </head>
  67. <body onload="paginaCargada()">
  68. <h1>Quiz 6</h1>
  69. <section id="quiz">
  70.  
  71. </body>
  72. </html>
  73.  

Proinf.net