14

呼び出されたときに DOM を操作する JavaScript 関数があります (CSS クラスを追加するなど)。これは、ユーザーがフォーム内のいくつかの値を変更したときに呼び出されます。ドキュメントが最初に読み込まれるときに、この関数を呼び出して初期状態を準備します (この場合、サーバー側から DOM を正しい初期状態に設定するよりも簡単です)。

window.onload を使用してこの機能を実行するか、変更が必要な DOM 要素の後にスクリプト ブロックを配置する方がよいでしょうか? どちらの場合でも、なぜそれが良いのですか？

例えば：

function updateDOM(id) {
    // updates the id element based on form state
}

次の方法で呼び出す必要があります。

window.onload = function() { updateDOM("myElement"); };

また：

<div id="myElement">...</div>
<script language="javascript">
    updateDOM("myElement");
</script>

前者はそれを行う標準的な方法のようですが、後者は、スクリプトがヒットするとすぐに要素を更新するため、おそらくより良いようです。要素の後に配置されている限り、私は問題はありません。

何かご意見は？あるバージョンは他のバージョンよりも本当に優れていますか?

4

9 に答える 9

17

onloadイベントはそれを行うための適切な方法と考えられていますが、javascriptライブラリを使用してもかまわない場合は、jQueryの$（document）.ready（）の方が優れています。

$(document).ready(function(){
  // manipulate the DOM all you want here
});

利点は次のとおりです。

  1. 実行する追加のコードを登録する回数だけ$（document）.ready（）を呼び出します。window.onloadを設定できるのは1回だけです。
  2. $（document）.ready（）アクションは、DOMが完了するとすぐに発生します。window.onloadは画像などを待機する必要があります。

JavaScriptのすべての質問でjQueryを提案する人にならないことを願っていますが、それは本当に素晴らしいことです。

于 2008-09-03T01:19:45.667 に答える
10

私はたくさんのJavascriptを書きましたが、window.onloadはそれを行うためのひどい方法です。それはもろく、ページのすべてのアセットが読み込まれるまで待機します。したがって、1つの画像が永久にかかる場合、またはリソースが30秒までタイムアウトしない場合、ユーザーがページを表示/操作できるようになる前にコードは実行されません。

また、別のJavascriptがwindow.onload = function（）{}を使用することを決定した場合、コードは吹き飛ばされます。

ページの準備ができたときにコードを実行する適切な方法は、変更する必要のある要素が準備ができている/利用可能になるのを待つことです。多くのJSライブラリには、これが組み込み機能として含まれています。

チェックアウト：

于 2008-09-03T02:12:33.387 に答える
5

必ず使用してonloadください。スクリプトはページから切り離しておいてください。

于 2008-09-03T00:37:36.733 に答える
3

mootoolsなどの一部のJavaScriptフレームワークでは、「domready」という名前の特別なイベントにアクセスできます。

DOMがロードされたときに実行されるウィンドウイベント「domready」が含まれています。アクセスしようとするコードが実行されたときにDOM要素が存在することを確認するには、それらを「domready」イベント内に配置する必要があります。

window.addEvent('domready', function() {
  alert("The DOM is ready.");
});
于 2008-09-03T01:19:18.053 に答える
2

IEのwindow.onloadは、バイナリ情報もロードされるのを待ちます。これは、「DOMがロードされるとき」の厳密な定義ではありません。そのため、ページが読み込まれたと認識されてからスクリプトが起動されるまでに、かなりの遅延が生じる可能性があります。このため、私はあなたのために重労働を処理するために豊富なJSフレームワーク（プロトタイプ/ jQuery）の1つを調べることをお勧めします。

于 2008-09-03T01:25:34.467 に答える
1

可能であればきれいなコードに window.onload を使用することについては他の人に同意しますが、ユーザーが IE で戻るボタンを押したときに window.onload が再度呼び出されると確信していますが、Firefox では再度呼び出されません。（最近変更された場合を除きます）。

編集：私はそれを逆にすることができました。

場合によっては、ユーザーが別のページから戻るボタンを押して自分のページに戻ったときにスクリプトを評価したい場合に、インライン スクリプトを使用する必要があります。

この回答への修正または追加は大歓迎です...私はjavascriptの専門家ではありません。

于 2008-09-03T01:13:00.893 に答える
1

@ギーク

ユーザーが IE で [戻る] ボタンを押したときに window.onload が再度呼び出されると確信していますが、Firefox では再度呼び出されません。（最近変更された場合を除きます）。

Firefox では、onloadページへの移動方法に関係なく、DOM の読み込みが完了すると呼び出されます。

于 2008-09-03T01:15:52.260 に答える
0

私の見解は、window.onload 関数を 1 つしか持つことができないため、前者です。インライン スクリプト ブロックにはnの数があります。

于 2008-09-03T00:39:25.700 に答える
0

onLoad を使用すると、実行される可能性のあるスクリプト タグを探して html の scad を読み下ろすよりも、ページが読み込まれたときに実行されるコードを確認する方がはるかに簡単です。

于 2008-09-03T01:09:30.840 に答える