¿Cómo llamo a una función de JavaScript al cargar la página?
Tradicionalmente, para llamar a una función de JavaScript una vez que la página se ha cargado, agregaba un onload
atributo 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 onload
atributo porque estoy usando fragmentos JSP, que no tienen ningún body
elemento 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.
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.
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.
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 onload
evento:
<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();
});