javaScriptとjQueryは自動的に簡単なコードの実現方法をロードします。
1871 ワード
これまでjavaScriptとjQueryで自動的にロードするいくつかの方法を整理しましたが、参考にしてください。
一、JavaScript自動ローディング
①テキストではonloadを使用します。ページ内のすべての内容(写真を含む)をロードした後、onloadを実行します。以下の通りです。
①ページ中のDOM構造(写真を含まない)をロードしてから実行する場合(DOM要素関連のものがロードされていない可能性があります)の3つの書き方があります。
一、JavaScript自動ローディング
①テキストではonloadを使用します。ページ内のすべての内容(写真を含む)をロードした後、onloadを実行します。以下の通りです。
<body onload="alert(1)"></body> <!-- onload -->
<body onload="alert(2);alert(3);alert(4)"></body> <!-- onload , 2 3 4 -->
②脚本ではwindow.onloadを使用します。ページのすべての内容(写真を含む)を読み込み終わったら、window.onloadを実行します。以下の通りです。
window.onload = function(){...}; // ,
//------------↓ window.onload -------------
window.onload = function(){alert("text1");}; //
window.onload = function(){alert("text2");}; //
//------------↑---------------------------------------
//------------↓ window.onload ---------------------------
window.attachEvent("onload",function(){alert('a')});
window.attachEvent("onload",function(){alert('b')});
window.attachEvent("onload",function(){alert('c')});
// : IE (window.attachEvent), c b a
// : (window.addEventListener), a b c
//------------↑-----------------------------------------------------
二、jQuery自動ローディング①ページ中のDOM構造(写真を含まない)をロードしてから実行する場合(DOM要素関連のものがロードされていない可能性があります)の3つの書き方があります。
$(document).ready(function(){...});// 1,
$(function(){...}); // 2,
jQuery(function($){...}); // 3,
②ページのすべての要素(画像を含む)の読み込みが完了したら、以下のように実行します。
$(window).load(function() {...}); // JavaScript , window.onload = function(){...};
③直ちに匿名関数を実行します。匿名関数が囲まれて、後に括弧を入れると、この匿名関数はすぐに実行されます。次のような書き方があります。
(function(){...})(); // 1,
(function($){...})(jQuery); // 2, ,