Come si chiama una funzione JavaScript nel caricamento della pagina

Come si chiama una funzione JavaScript nel caricamento della pagina
L'accesso a varie funzionalità al carico di pagina è richiesto in molte pagine Web e siti Web per garantire il funzionamento di vari algoritmi implementati. Inoltre, durante l'esecuzione di test automatizzati di un sito Web, questa funzione è molto utile per configurare il funzionamento di varie operazioni all'interno di una funzione e debugle.

Questo articolo dimostrerà i metodi per accedere a una funzione sul caricamento della pagina in JavaScript.

Come si chiama/invocare una funzione sul caricamento della pagina in JavaScript?

Per chiamare una funzione JavaScript nel caricamento della pagina, è possibile utilizzare i seguenti approcci:

  • "finestra.Onload"Evento
  • "documento.addEventListener ()" metodo
  • "corpo onload"Evento

Discuteremo ora ciascuno degli approcci menzionati uno per uno!

Metodo 1: invocare una funzione JavaScript al carico di pagina usando la finestra.Evento Onload

IL "finestra.Onload"L'evento si verifica quando l'intera pagina insieme ai suoi contenuti si carica. Più specificamente, questo evento può essere applicato per accedere a una funzione specifica al carico della pagina.

Sintassi

finestra.onload = function ()

Nella sintassi data, "funzione"Si riferisce alla funzione che viene invocata quando la finestra viene caricata.

Il seguente esempio spiega il concetto discusso.

Esempio

Nell'esempio seguente, inizializza le due variabili con i valori interi indicati:

var load1 = 6;
var load2 = 4;

Ora, definisci una funzione chiamata "PageOnload ()"E posizionare le variabili create come argomento. Inoltre, restituisce l'aggiunta dei valori specificati rispetto alle variabili:

Funzione PageOnload (load1, load2)
restituire load1 + load2;

Infine, applica il "finestra.Onload"Evento in modo tale che quando si carica la pagina si accede alla funzione e viene restituita la somma dei valori:

finestra.onload = function ()
console.log ("Il valore risultante è:",)
console.log (pageonload (load1, load2));

L'output corrispondente sarà:

L'output di cui sopra è il risultato della pagina Onload e accedere alle funzioni contemporaneamente.

Metodo 2: accedere a una funzione sul caricamento della pagina in JavaScript utilizzando

documento.Metodo addEventListener ()

IL "documento.addEventListener ()"Il metodo unisce un gestore di eventi a un documento. Questo metodo può essere implementato per aggiungere l'evento specificato per il caricamento della pagina e chiamare una particolare funzione in cambio.

Sintassi

documento.addEventListener (evento, funzione)

Nella sintassi sopra, "evento"Si riferisce a un evento che attiverà e invocherà il specificato"funzione".

Guarda il seguente esempio.

Esempio

Innanzitutto, assegnare l'ID specificato chiamato "carico"All'elemento Div:

Successivamente, accedi al contenitore creato passando il suo ID a "documento.getElementById ()" metodo:

Let Load = document.getElementById ("caricamento");

Successivamente, aggiungi un evento chiamato "Domcontentload" usando il "documento.addEventListener ()"Metodo per caricare la pagina e accedere alla funzione PageOnload ():

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

Infine, definisci una funzione chiamata "PageOnload ()". Qui, visualizza i seguenti messaggi nella finestra di dialogo Avviso e nel modello Object Model (DOM) del documento nel caricamento della pagina:

Funzione PageOnload ()
Avviso ("Chiamata Funzione sul caricamento della pagina.");
carico.InnerHtml = "Funzione corpo eseguito correttamente nel caricamento della pagina."

Produzione

Metodo 3: chiama una funzione sul caricamento della pagina in JavaScript usando Body Onload Event

IL "corpo onload"L'evento esegue la funzione specificata al termine del processo di caricamento della pagina. Questa tecnica può essere applicata per accedere a più funzioni posizionandole negli argomenti di una funzione risultante ed eseguendo la funzionalità desiderata sul carico della pagina.

Sintassi

Nella sintassi sopra, "funzione()"Si riferisce alla funzione che verrà chiamata al caricamento della pagina.

Il seguente esempio chiarirà il concetto.

Esempio

In primo luogo, applica il “corpo onload"Reindirizzamento dell'evento alla funzione specificata"eseguire()":

Successivamente, definisci una funzione chiamata "PageOnload1 ()"Che restituisce un valore:

funzione pageonload1 ()
restituire "3";

Allo stesso modo, definisci una funzione chiamata "PageOnload2 ()"E restituire il valore specificato:

funzione pageonload2 ()
restituire "2";

Ora, definisci una funzione chiamata "PageOnload ()"Avere le funzioni definite sopra come i suoi argomenti. In questa funzione, entrambi i valori restituiti dalle funzioni accessibili saranno moltiplicati e restituiti:

Funzione PageOnload (Pageonload1, pageonload2)
return pageonload1 () * pageonload2 ();

Infine, la funzione definita "eseguire()"Accederà alla funzione"PageOnload ()"E registra le sue funzionalità (moltiplicazione di entrambi i numeri):

funzione esecute ()
console.log ("Il valore risultante è:")
console.log (pageonload (pageonload1, pageonload2));

Produzione

Abbiamo spiegato i metodi per chiamare una funzione JavaScript nel caricamento della pagina.

Conclusione

Per chiamare una funzione sul caricamento della pagina utilizzando JavaScript, applica “finestra.onload ()"Evento per accedere alla funzione al carico della pagina, il"documento.addEventListener ()"Metodo per aggiungere un evento particolare per il caricamento della pagina o del"corpo onload"Evento per unire le funzionalità delle funzioni in un'unica funzione. Questo manuale ha dimostrato i metodi per accedere a una funzione sul caricamento della pagina in JavaScript.