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

Se requiere acceder a diversas funcionalidades sobre la carga de la página en muchas páginas y sitios web web para garantizar el funcionamiento de varios algoritmos implementados. Además, mientras realiza pruebas automatizadas de un sitio web, esta característica es muy útil para configurar el funcionamiento de varias operaciones dentro de una función y depurarlas.

Este artículo demostrará los métodos para acceder a una función en la carga de la página en JavaScript.

¿Cómo llamo/invoco una función en la carga de la página en JavaScript??

Para llamar a una función JavaScript en la carga de la página, se pueden utilizar los siguientes enfoques:

• "ventana.encendido" evento
• "documento.addEventListener ()" método
• "Cuerpo encendido" evento

Ahora discutiremos cada uno de los enfoques mencionados uno por uno!

Método 1: Invocar una función JavaScript en la carga de la página usando la ventana.Evento de carga

El "ventana.encendido"El evento ocurre cuando toda la página junto con sus cargas de contenido. Más específicamente, este evento se puede aplicar para acceder a una función específica en la carga de la página.

Sintaxis

ventana.onload = function ()

En la sintaxis dada, "función"Se refiere a la función que se invoca cuando se carga la ventana.

El siguiente ejemplo explica el concepto discutido.

Ejemplo

En el siguiente ejemplo, inicialice las dos variables con los valores enteros dados:

var carga1 = 6;
var carga2 = 4;

Ahora, defina una función llamada "PageOnload ()"Y coloque las variables creadas como argumento. Además, devuelva la adición de los valores especificados contra las variables:

función PageOnload (Load1, Load2)
return load1 + load2;

Finalmente, aplique el "ventana.encendido"Evento de tal manera que cuando se carga la página, se accede a la función y se devuelve la suma de los valores:

ventana.onload = function ()
consola.log ("El valor resultante es:",)
consola.log (PageOnload (Load1, Load2));

La salida correspondiente será:

La salida anterior es el resultado de las funciones de carga y acceso de página al mismo tiempo.

Método 2: acceder a una función en la página de carga en JavaScript usando

documento.método addEventListener ()

El "documento.addEventListener ()El método fusiona un controlador de eventos a un documento. Este método se puede implementar para agregar el evento especificado para cargar la página y llamar a una función particular a cambio.

Sintaxis

documento.addEventListener (evento, función)

En la sintaxis anterior, "evento"Se refiere a un evento que se activará e invocará lo especificado"función".

Mira el siguiente ejemplo.

Ejemplo

Primero, asigne la ID especificada llamada "carga"Al elemento div:

A continuación, acceda al contenedor creado pasando su identificación al "documento.getElementById ()" método:

dejar carga = documento.getElementById ("cargar");

Después de eso, agregue un evento llamado "DomcontentLoaded" utilizando el "documento.addEventListener ()Método "para cargar la página y acceder a la función PageonLoad ()::

documento.addEventListener ("DomContentLoaded", PageOnload ());

Finalmente, defina una función llamada "PageOnload ()". Aquí, muestre los siguientes mensajes en el cuadro de diálogo de alerta y en el modelo de objeto de documento (DOM) respectivamente en la carga de la página:

function pageonload ()
alerta ("Llamada de función en la carga de la página.");
carga.innerhtml = "cuerpo de función ejecutado correctamente en la carga de la página."

Producción

Método 3: Llame a una función en la página de carga en JavaScript usando el evento Body Onload

El "Cuerpo encendido"Evento ejecuta la función especificada cuando el proceso de carga de la página se completa. Esta técnica se puede aplicar para acceder a múltiples funciones colocándolas en los argumentos de una función resultante y realizando la funcionalidad deseada en la carga de la página.

Sintaxis

En la sintaxis anterior, "función()"Se refiere a la función que se solicitará la carga de la página.

El siguiente ejemplo aclarará el concepto.

Ejemplo

En primer lugar, aplique el "Cuerpo encendido"Redirección de eventos a la función especificada"ejecutar()":

A continuación, defina una función llamada "PageOnload1 ()"Que devuelve un valor:

función pageonload1 ()
regresar "3";

Del mismo modo, defina una función llamada "PageOnload2 ()”Y devuelva el valor especificado:

función pageonload2 ()
regresar "2";

Ahora, defina una función llamada "PageOnload ()"Tener las funciones definidas anteriormente como sus argumentos. En esta función, ambos valores devueltos de las funciones accedidas se multiplicarán y devolverán:

función PageOnload (PageOnload1, PageOnload2)
return PageonLoad1 () * PageOnload2 ();

Por último, la función definida "ejecutar()"Accederá a la función"PageOnload ()"Y registre sus funcionalidades (multiplicación de ambos números):

función ejecute ()
consola.log ("El valor resultante es:")
consola.log (PageOnload (PageOnload1, PageOnload2));

Producción

Hemos explicado los métodos para llamar a una función JavaScript en la carga de la página.

Conclusión

Para llamar a una función en la carga de la página usando JavaScript, aplique el "ventana.Onload ()"Evento para acceder a la función en la carga de la página, el"documento.addEventListener ()"Método para agregar un evento particular para cargar la página o el"Cuerpo encendido"Evento para fusionar las funcionalidades de las funciones en una sola función. Este manual demostró los métodos para acceder a una función en la carga de la página en JavaScript.