Come eseguire una funzione quando la pagina viene caricata in JavaScript?
Questo articolo utilizzerà i seguenti metodi per ottenere l'attività a portata di mano:
- Utilizzo dell'evento Onload sulla variabile dell'interfaccia Windows
- Mettere un attributo Onload all'interno del tag
- Definizione di un ascoltatore di eventi personalizzati sulla variabile dell'interfaccia della finestra
- Utilizzo del documento.attributo onreadystatechange
Cominciamo con il primo.
Metodo 1: Evento di finestra Onload
L'evento Onload () può essere utilizzato con qualsiasi elemento di una pagina HTML e eseguirà le azioni fornite al suo interno dopo che quell'elemento è stato completamente caricato. Per eseguire una funzione solo dopo il tutto "finestra"È stato caricato, usa la" finestra.Proprietà Onload "nel file di script e impostarla uguale a una funzione come
finestra.onload = function ()Avviso ("Pagina è stata caricata");
;
Nella funzione, viene inviato un avviso che dice "Page è stata caricata". Eseguire la pagina web HTML e osservare i seguenti risultati:
Dall'output è chiaro che la funzione è stata eseguita dopo che il browser ha caricato completamente la "finestra" della pagina web.
Metodo 2: utilizzando l'attributo Onload con il tag corporeo
Poiché il tag del corpo include tutti quei dati visualizzati sul browser Web, quindi mettendo un attributo Onload e impostandolo uguale a una funzione in quel tag significherebbe essenzialmente l'esecuzione della funzione dopo che tutto sulla pagina web è stato completamente caricato.
Ad esempio, crea una pagina web HTML con queste righe:
alt = ""
/>
Come eseguire una funzione quando la pagina viene caricata in JavaScript ?
Questo è un esempio di attributo di Onload Body
Il punto chiave qui è che nel corpo che abbiamo usato l'attributo onload = "fultured ()". Questo farà cercare la pagina webcaricato completamente()"Funzione nello script dopo che tutti gli elementi all'interno della pagina web sono stati caricati.
Entra all'interno del file di script e aggiungi le seguenti righe:
funzione completamente caricata ()Avviso ("La pagina web è stata completamente caricata!");
Eseguire l'HTML e l'output sul browser sarà così:
L'utente viene richiesto dopo il tag del corpo e tutti gli elementi all'interno del tag del corpo sono stati completamente caricati.
Metodo 3: aggiunta di un ascoltatore di eventi sulla variabile dell'interfaccia "finestra"
Uno dei metodi più antichi ma ancora efficace. Nel file JavaScript, aggiungi semplicemente un ascoltatore di eventi utilizzando l'operatore DOT con il nostro "finestra"Variabile di interfaccia. Lo stato all'interno dell'ascoltatore di eventi sarà "carico"E su quello stato cambia, definisci una funzione da eseguire. Tutto ciò si ottiene utilizzando le seguenti righe:
finestra.addEventListener ("Load", function ()Avviso ("È caricato!");
);
Successivamente, è sufficiente caricare la pagina web HTML nel browser e osservare la seguente uscita:
All'utente viene richiesto non appena la finestra è completamente caricata. Tuttavia, si noti che questo avviso appare quando il "finestra"È caricato. Ciò significa che l'utente potrebbe ottenere l'avviso prima di caricare completamente tutti gli elementi.
Metodo 4: utilizzando l'attributo OnReadyStateChange del documento,
Dom ha questo attributo chiamato "onreadystatechange"Che viene acceso ogni volta che lo stato del documento viene modificato. Questo può essere utilizzato per eseguire una funzione, ma l'unico problema è che questa variabile o attributo può contenere stati diversi come caricamento, in sospeso, elaborazione e completa. Questo perché questo attributo è più usato per le richieste XML o HTML.
Un controllo deve essere indotto per eseguire una funzione solo quando il documento è completamente caricato. Usa le seguenti righe all'interno del file JavaScript:
documento.onreadystatechange = function ()if (documento.readystate == "complet")
Avviso ("Yahoo!");
;
Nello snippet di codice sopra, è stato posizionato un controllo per cercare uno stato specifico "completo" solo allora l'utente viene avvisato. Accendi la pagina web HTML e osserva l'output:
L'utente è stato avvisato dopo che lo stato pronto del documento era "completo".
Incartare
Esistono alcuni modi per eseguire una funzione JavaScript non appena la pagina web ha completamente caricato. Per dimostrarlo, in questo articolo, in ogni metodo, hai usato un mettere in guardia funzione per mostrare un avviso che descrive che la pagina Web abbia eseguito la funzione JavaScript dopo il caricamento completo di quella pagina Web.