¿Cómo llamo a una función de JavaScript al cargar la página?

Resuelto palAlaa asked hace 14 años • 9 respuestas

Tradicionalmente, para llamar a una función de JavaScript una vez que la página se ha cargado, agregaba un onloadatributo al cuerpo que contenía un poco de JavaScript (generalmente solo llamaba a una función).

<body onload="foo()">

Cuando la página se haya cargado, quiero ejecutar algún código JavaScript para completar dinámicamente partes de la página con datos del servidor. No puedo usar el onloadatributo porque estoy usando fragmentos JSP, que no tienen ningún bodyelemento al que pueda agregar un atributo.

¿Existe alguna otra forma de llamar a una función de JavaScript durante la carga? Prefiero no usar jQuery porque no estoy muy familiarizado con él.

palAlaa avatar Oct 02 '10 02:10 palAlaa
Aceptado

Si desea que el método onload tome parámetros, puede hacer algo similar a esto:

window.onload = function() {
  yourFunction(param1, param2);
};

Esto vincula onload a una función anónima, que cuando se invoca, ejecutará la función deseada, con cualquier parámetro que le proporcione. Y, por supuesto, puedes ejecutar más de una función desde dentro de la función anónima.

Matt Sieker avatar Oct 01 '2010 20:10 Matt Sieker

Otra forma de hacerlo es mediante el uso de detectores de eventos; así es como se usan:

document.addEventListener("DOMContentLoaded", function() {
  your_function(...);
});

Explicación:

DOMContentLoaded Significa cuando los objetos DOM del documento están completamente cargados y vistos por JavaScript. También esto podría haber sido "clic", "enfoque"...

function() Función anónima, se invocará cuando ocurra el evento.

Ahmed Jolani avatar Apr 28 '2012 21:04 Ahmed Jolani

Su pregunta original no estaba clara, suponiendo que la edición/interpretación de Kevin sea correcta, entonces esta primera opción no se aplica

Las opciones típicas son usar el onloadevento:

<body onload="javascript:SomeFunction()">
....

También puedes colocar tu JavaScript al final del cuerpo; no comenzará a ejecutarse hasta que se complete el documento.

<body>
  ...
  <script type="text/javascript">
    SomeFunction();
  </script>
</body>

Otra opción es utilizar un marco JS que intrínsecamente haga esto:

// jQuery
$(document).ready( function () {
  SomeFunction();
});
STW avatar Oct 01 '2010 19:10 STW