Appeler la fonction JavaScript au chargement de la page
- Fonction JavaScript qui prend des variables comme paramètre
- Fonction d’appel JavaScript qui prend des fonctions comme argument lors du chargement
Une fonction qui peut être appelée chaque fois que la page Web est chargée. Cette convention dépend de l’objet navigateur window et de sa propriété onload. La méthode de base pour savoir que votre fonction est appelée est de vérifier le panneau de la console.
Pour l’exemple démonstratif, nous considérerons une structure HTML, où nous voulons visualiser comment sera notre sortie. Et chaque fois que nous rechargeons la page Web, le panneau de la console répondra à une instruction donnée dirigée par la propriété window.onload.
Fonction JavaScript qui prend des variables comme paramètre
Ici, nous allons utiliser une fonction qui prend des variables comme arguments. Parallèlement, le lecteur de codage expérimenté dans jsbin est de saisir une meilleure compréhension. Vous pouvez, dans tous les cas, utiliser votre navigateur et votre éditeur préféré.
Extrait de code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Test</title>
</head>
<body onload = func()>
<p id="output"></p>
<script>
var x = 40;
var y = 2;
function func(x, y){
return x+y;
}
window.onload = function(){
console.log(func(x,y));
}
document.getElementById('output').innerHTML = func(x,y);
</script>
</body>
</html>
Production :
Dans ce cas, la partie script a été ajoutée à l’intérieur du corps HTML, et comme vous pouvez le voir, à chaque chargement de la page Web, la console a une valeur, ce qui explique que le code global fonctionne.
De plus, le cas d’utilisation de base de window.onload consiste à s’assurer que la page se charge avec succès à chaque fois. Il s’agit très probablement d’un paramètre garantissant un bloc de code sans erreur dans votre code HTML. Ainsi, vous pouvez l’utiliser n’importe où selon votre convenance.
Fonction d’appel JavaScript qui prend des fonctions comme argument lors du chargement
Les exemples suivants expliqueront différemment la fonction de la propriété window.onload. Nous utiliserons une section de code HTML et une section de code JavaScript individuelle. Les paramètres de notre fonction sont quelques autres fonctions.
Extrait de code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Test</title>
<style>
p{
background: white;
}
</style>
</head>
<body onload = func()>
<p id="output"></p>
</body>
</html>
function f1() {
return '4';
}
function f2() {
return '2';
}
function func(f1, f2) {
return f1() + f2();
}
window.onload =
function() {
console.log(func(f1, f2));
}
document.getElementById('output')
.innerHTML = func(f1, f2);
Production :
À partir du scénario de sortie, chaque fois que vous appuyez sur Run with JS, cela donne une expérience similaire de chargement d’une page Web. Le code n’a pas d’erreur, et c’est la déclaration déductible que nous pouvons déduire de l’appel d’une fonction à chaque chargement de page.
