第3章 jQueryの構文
jQuery(ジェイクエリー)は、ウェブブラウザ用のJavaScriptコードをより容易に記述できるようにするために設計されたJavaScriptライブラリである。
homepage
# **jQueryの構文** *** jQueryを使用すると、HTML要素を選択(クエリ)し、それらに対して「アクション」を実行します。 ## **1.jQueryの構文** jQueryの構文は、HTML要素を**選択**し、その要素に対して何らかの**アクション**を実行するためのものです。 基本的な構文は次のとおりです。 > **$(selector)アクション()** * jQueryを定義/アクセスするための$記号 * HTML要素を「照会(または検索)」するための(セレクター) * 要素に対して実行されるjQueryのaction() <br> **例 :** `$(this).hide()` - 現在の要素を隠します。 `$("p").hide()` - すべての`<p>`要素を非表示にします。 `$(".test").hide()` - class = "test"を持つすべての要素を隠します。 `$("#test").hide()` - id = "test"の要素を隠します。 <br> > **あなたはCSSセレクターに精通していますか?** >>jQueryはCSS構文を使って要素を選択します。このチュートリアルの次の章で、セレクタの構文の詳細を学びます。 >**ヒント:** CSSがわからない場合は、CSSチュートリアルを読んでください。 <br><br> ## **2.ドキュメントレディイベント** あなたは、私たちの例の中のすべてのjQueryメソッドがdocument readyイベントの中にあることに気付いたでしょう: ``` $(document).ready(function(){ // jQuery methods go here... }); ``` <br> これは、ドキュメントの読み込みが完了する(準備ができる)前にjQueryコードが実行されないようにするためです。 ドキュメントを使用する前に、ドキュメントが完全にロードされ準備が整うのを待つことをお勧めします。これにより、JavaScriptコードをドキュメントの本文の前のheadセクションに配置することもできます。 ドキュメントが完全にロードされる前にメソッドが実行されると失敗する可能性があるアクションの例をいくつか示します。 * まだ作成されていない要素を隠そうとしています * まだ読み込まれていない画像のサイズを取得しようとしています > **ヒント:** jQueryチームはdocument readyイベントのためのさらに短いメソッドも作成しました。 ``` $(function(){ // jQuery methods go here... }); ``` 好きな構文を使ってください。コードを読むと、document readyイベントの方が理解しやすいと思います。
content
戻る