Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: @XSStringManolo en 29 Diciembre 2019, 19:17 pm



Título: [Resuelto] javascript. Código sencillo no funciona. addEventListener a botones.
Publicado por: @XSStringManolo en 29 Diciembre 2019, 19:17 pm
Un botón no va, y el otro sí. Los creo de la misma manera.
Pensé que era algún error relacionado con que ambos botones hacen referencia al mismo objeto en memoria, pero comenté el botón que va y la llamada a la funciòn que lo crea y sigue sin ir el primer botón.
A ver si alguien sabe por qué. Ni tengo ni la más mínima idea de que pasa.
Código
  1. <!DOCTYPE html>
  2. <meta charset="utf-8" />
  3. <html>
  4. <head>
  5. <script>
  6. "use strict";
  7. function crearElemento(etiqueta, IDpadre, tipo, valor, id, nombre, fuente, clase, pista, enClick, dentro, retorno)
  8. {
  9.  
  10. if(!etiqueta)
  11. throw new SyntaxError("El parámetro etiqueta está sin definir.");
  12.  
  13. if(!IDpadre)
  14. throw new SyntaxError("El parámetro padre está sin definir.");
  15.  
  16. var elemento = document.createElement(etiqueta);
  17. elemento.type = tipo;
  18. elemento.value = valor;
  19. elemento.id = id;
  20. elemento.name = nombre;
  21. elemento.src = fuente;
  22. elemento.class = clase;
  23. elemento.placeholder = pista;
  24. elemento.onclick = enClick;
  25. elemento.innerHTML = dentro;
  26.  
  27. document.getElementById(IDpadre).appendChild(elemento);
  28.  
  29.   if(retorno === true)
  30.   {
  31.   return elemento;
  32.   }
  33.  
  34. }
  35.  
  36. function añadirEtiqueta(idPadre, etiqueta)
  37. {
  38. document.getElementById(idPadre).innerHTML += etiqueta;
  39. }
  40.  
  41. /* Constantes */
  42. var body="body", input="input", text="text", no="", button="button", si = true;
  43. </script>
  44.  
  45. <script>
  46. "use strict";
  47. function CrearWeb()
  48. {
  49. añadirEtiqueta(body, "Dominios:<br />");
  50.  
  51. var i = 1;
  52. var ejemplo="https://example.com/";
  53.  
  54. var dominio1 = crearElemento(input, body, text, no, "dominio"+i, "dominio"+i, no, no, ejemplo, no, no, si);
  55.  
  56. var botonAgregarDominio1 = crearElemento(button, body, button, no, "botonAgregarDominio"+i, "botonAgregarDominio"+i, no, no, no, no, "+", si);
  57.  
  58. añadirEtiqueta(body, "<br />");
  59.  
  60. var Diccionario1 = crearElemento(input, body, text, no, "diccionario"+i, "diccionario"+i, no, no, ejemplo+"lista.txt", no, no, si);
  61.  
  62. var botonAgregarDiccionario1 = crearElemento(button, body, button, no, "botonAgregarDiccionario"+i, "botonAgregarDiccionario"+i, no, no, no, no, "+", si);
  63.  
  64. botonAgregarDiccionario1.addEventListener("click", function(){alert("test2");});
  65.  
  66. /* ESTE NO VA */
  67. botonAgregarDominio1.addEventListener("click", function(){alert("test1");});
  68.  
  69. }
  70. </script>
  71. </head>
  72. <body id="body" onload="CrearWeb();">
  73. </body>
  74. </html>


Título: Re: javascript. Código sencillo no funciona. addEventListener a botones.
Publicado por: MinusFour en 29 Diciembre 2019, 22:26 pm
Porque cuando haces:

Código
  1. añadirEtiqueta(body, "<br />");

Te cargas todo el body y lo recreas de nuevo. Modificar el innerHTML significa que el navegador va a parsear todo el HTML de ese elemento y substituir todos los elementos en el DOM hijos de ese elemento por los nuevos.


Título: Re: javascript. Código sencillo no funciona. addEventListener a botones.
Publicado por: @XSStringManolo en 29 Diciembre 2019, 22:40 pm
Porque cuando haces:

Código
  1. añadirEtiqueta(body, "<br />");

Te cargas todo el body y lo recreas de nuevo. Modificar el innerHTML significa que el navegador va a parsear todo el HTML de ese elemento y substituir todos los elementos en el DOM hijos de ese elemento por los nuevos.
Andaaaaa! No se me olvida en la vida. Crack!