ホームページ  >  記事  >  ウェブフロントエンド  >  Jquery_jqueryの「$(document).ready(function(){ })」関数の使い方の詳しい説明

Jquery_jqueryの「$(document).ready(function(){ })」関数の使い方の詳しい説明

WBOY
WBOYオリジナル
2016-05-16 17:06:181671ブラウズ

Jquery は優れた Javascript フレームワークです。$ は jQuery ライブラリの宣言です。jQuery.noConflict(); という安定した記述メソッドに変更してください。 ( ){});

jQuery を使用する利点は、DOM オブジェクトに対するさまざまなブラウザ バージョンの操作をパッケージ化できることです (JavaScript の DOM オブジェクトについては知っておく必要があります。

)。

例:
$("div p"); // (1)
$("div.container"); // (2)
$("div # msg" ); // (3)
$("table a",context); // (4)
$("#myId"); //(5)

コードの最初の行は、

タグの下にあるすべての

要素を取得します。コードの 2 行目はクラス コンテナを持つ

要素を取得し、コードの 3 行目は
タグの下にある id msg を持つ要素を取得します。コードの 4 行目は、コンテキストが context であるテーブル内のすべての接続要素を取得します。コードの 5 行目は、ID myid を持つすべての要素を取得します。

CSS に慣れている人であれば、これらの記述方法は非常に馴染み深いものであることがわかります。右。その通り。その秘密がわかります。これは、jquery が Dom オブジェクト内の要素を見つける方法です。 CSS セレクターに似ています。

今すぐ具体的な質問に答えてみましょう

$(document).ready(function(){
alert("hello");
});(1)

(2)

上記の 2 つのコードは同等です。ただし、コード 1 の利点は、パフォーマンスとロジックを分離できることです。また、同じ操作を異なる js ファイルで実行することもできます。つまり、$(document).ready (fn) は競合することなくページ内で繰り返し出現できます。基本的に、Jquery の多くのプラグインはこの機能を利用しているため、初期化中に競合することなく複数のプラグインを一緒に使用できます。


$(document).ready(function(){
追加されたコンテンツ
});
コンテンツを追加$(".btn-slide").click( function (){
alert("a タグ内の btn-slide と等しいクラスを持つリンクをクリックしました");
});

は、class=btn-slide を持つスーパー リンクをクリックすると、「a タグ内の btn-slide と等しいクラスを持つリンクをクリックしました。」というダイアログ ボックスがポップアップすることを意味します。

非常に便利で使いやすいので、jquery を使用するのが良い選択です。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。