jquery ガイド/はじめに_jquery

ガイド/基本

これは、jquery を使い始めるのに役立つように設計された基本ガイドです。 jquery は、一般的な問題の解決策を提供します。まだテスト ページを作成していない場合は、次の内容の HTML ページを作成することをお勧めします: プログラム コード

コードをコピー コードは次のとおりです: src="link /to/jquery.js"> // ここにコードが入ります &lt ;/head> jQuery jquery.js を指すように script タグの src 属性を変更します。たとえば、jQuery.js が HTML ファイルと同じディレクトリにある場合、次のようにすることができます。 プログラム コード ドキュメントのロード時にコードを実行する まず、ほとんどの JavaScript プログラマーは、次のようなコードを使用します: プログラム コード window.onload = function(){ ... } > HTML ドキュメントの要素にアクセスするには、最初にドキュメント オブジェクト モデル (DOM) をロードする必要があります。 window.onload 関数が実行されると、画像やバナーなどを含むすべてが読み込まれたことを意味します。大きい画像のダウンロード速度は遅くなるため、ユーザーは window.onload() 実行のコード効果を確認する前に、大きい画像がダウンロードされるまで待つ必要があり、待ち時間が長くなります。私たちが望むものではありません。

このために、jquery は「ready」イベントを提供します。次のコード スニペットを使用できます。 プログラム コード $(document).ready(function(){ // code }); $(document) はドキュメント オブジェクトを取得することを意味し (window.document と同様)、$(document).ready は準備ができたときにドキュメント オブジェクトを取得することを意味します。 上記のコードの意味は、操作が許可されるまでドキュメント オブジェクトをチェックすることです (翻訳者注: これは window.onload() 関数よりもはるかに高速です。ドキュメント オブジェクトがロードされている限り、ページ上の画像のダウンロードが完了するのを待たずにコードを実行できます) --- これが私たちが望んでいることです。したがって、上記のコード スニペットをテスト ページのスクリプト領域に貼り付けてください。

マウスのクリック時にトリガー まず、マウスがハイパーリンクをクリックしたときに特定の動作をトリガーしてみます。準備ができた関数に次のコードを追加します: プログラム コード $("a").click(function(){ alert("Thank you for coming!"); });

HTML ファイルを保存し、ページを更新します。ハイパーリンクをクリックすると、ページ上に警告ダイアログ ボックスが表示されます。

CSS クラスの追加 もう 1 つの一般的なタスクは、要素の CSS クラスを追加または削除することです。例: プログラム コード $("a").addClass( "test"); $("a").removeClass("test");

ページの先頭に追加した場合: プログラム コード a{text-weight:bolder} 次に、addClass 関数を呼び出すと、すべてのハイパーリンクのフォントが太字になります。

特殊効果 エフェクト モジュールは、一連の便利な特殊効果を提供します。

次のコードを追加します: プログラム コード $("a").click(function(){ $(this).hide("slow"); return false; }); これで、ハイパーリンクをクリックしている間、ハイパーリンクは徐々に消えます。 「return false」はデフォルトの動作を保持することを意味し、ページはジャンプしません。

コールバック

いわゆるコールバックは、親関数の実行完了後に戻り値として別の関数に渡すことができる関数です。コールバック関数の特別な点は、「親関数」の後に表示される関数を、コールバック関数が実行される前に実行できることです。 もう 1 つの重要な点は、コールバックの正しい使用方法を知ることです。正しい構文を忘れてしまうことがよくあります。

パラメーターのないコールバックは次のように記述する必要があります: プログラム コード $.get('myhtmlpage.html', myCallBack); 2 番目のパラメーターは単純な関数であることに注意してください。 (文字ではないので括弧はありません)

では、パラメーター付きのコールバックを記述するにはどうすればよいでしょうか? 記述方法が間違っているため、次のコードは機能しません (または実行されません): プログラム コード $.get('myhtmlpage.html', myCallBack(param1,param2));正しい書き方: プログラムコード $.get('myhtmlpage.html', function(){ myCallBack(param1,param2); });コールバックはパラメータ付きの関数で実装されます。

追記 この時点で、残りの ドキュメント 。さらに多くの ガイド が含まれています。これは包括的であり、jquery のあらゆる側面をカバーしています。ご質問がございましたら、お気軽にメールをお送りください。 もちろん、jQuery を使用したさまざまな DEMO をご覧いただくこともできます。