¿Cuál es la diferencia entre todos los siguientes eventos?
Tengo una pregunta sobre la diferencia entre:
- window.onload = myFunction;
- window.addEventListener(“load”, myFunction)
- window.onload = myFunction();
¿Son todos equivalentes? ¿Cuál es la mejor práctica a seguir?
davy.ai
No, no son todos equivalentes.
<body onload="myFunction()">
– este código ejecutarámyFunction
cuando el cuerpo de la página HTML se haya cargado. Este enfoque es antiguo y no se recomienda, ya que no es una buena práctica mezclar HTML con JavaScript.window.onload = myFunction;
– este código adjunta un escucha de eventos al eventoload
del objetowindow
, el cual ejecutamyFunction
cuando la ventana se ha cargado. Este es un enfoque más moderno y es una práctica mejor que la primera opción.window.addEventListener("load", myFunction)
– este código agrega un escucha de eventos al eventoload
del objetowindow
utilizando el métodoaddEventListener
. Este también es un enfoque moderno y es preferido sobre la primera opción.window.onload = myFunction();
– este código ejecutamyFunction
inmediatamente y asigna su valor de retorno a la propiedadonload
del objetowindow
. Este enfoque es incorrecto y no debe ser utilizado, ya que llamará amyFunction
tan pronto como el script se haya cargado, no cuando la ventana haya terminado de cargar.En conclusión, las opciones 2 y 3 son las mejores prácticas para adjuntar una función al evento
load
de la ventana. La opción 1 está desactualizada y no debe ser utilizada, y la opción 4 es incorrecta y debe ser evitada.