ページの読み込み時に JavaScript 関数を呼び出す
Web ページが読み込まれるたびに呼び出すことができる関数。この規則は、ブラウザオブジェクト window とそのプロパティ onload に依存します。関数が呼び出されていることを知る基本的な方法は、コンソールパネルを確認することです。
実例として、出力がどのようになるかを視覚化する HTML 構造を検討します。また、Web ページをリロードするたびに、コンソールパネルは window.onload プロパティによって指示された特定のステートメントに応答します。
変数をパラメータとして受け取る JavaScript 関数
ここでは、変数を引数として取る関数を使用します。それに加えて、jsbin で実験されたコーディングドライブは、より良い理解を得ることです。どちらの方法でも、ブラウザと適切なエディタを使用できます。
コードスニペット：
<!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>
出力：
この例では、スクリプト部分が HTML 本文内に追加されており、ご覧のとおり、Web ページが読み込まれるたびに、コンソールに値があり、コード全体が機能していることを示しています。
さらに、window.onload の基本的な使用例は、ページが毎回正常に読み込まれるようにすることです。これは、HTML でエラーのないコードブロックを確保するためのパラメータとして機能する可能性があります。だから、あなたの都合に合わせてどこでも使用できます。
ロード時に引数として関数を受け取る JavaScript 呼び出し関数
次の例では、window.onload プロパティの機能を別の方法で説明します。HTML コードセクションと個別の JavaScript コードセクションを使用します。私たちの関数のパラメーターは他のいくつかの関数です。
コードスニペット：
<!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);
出力：
出力シナリオから、Run with JS を押すと、Web ページをロードするのと同じようなエクスペリエンスが得られます。コードにエラーはありません。これは、ページの読み込みごとに関数を呼び出すことから導き出せる推測可能なステートメントです。
