jQuery 構文

jQuery を使用すると、HTML 要素を選択（クエリ）し、それらに対して「操作」（アクション）を実行できます。

jQuery 構文

jQuery の構文は、HTML 要素を選択し、選択した要素に対して何らかの操作を実行することです。

基本構文：$(selector).action()

• ドル記号は jQuery を定義します
• セレクター（selector）は HTML 要素を「クエリ」および「検索」します
• jQuery の action() は要素に対する操作を実行します

例：

• $(this).hide() - 現在の要素を非表示にする

• $("p").hide() - すべての <p> 要素を非表示にする

• $("p.test").hide() - class="test" のすべての <p> 要素を非表示にする

• $("#test").hide() - id="test" の要素を非表示にする

	CSS セレクターに慣れていますか？ jQuery が使用する構文は、XPath と CSS セレクター構文の組み合わせです。このチュートリアルの以降の章では、セレクターの構文についてさらに学びます。

ドキュメント準備完了イベント

お気づきかもしれませんが、この例のすべての jQuery 関数は document ready 関数内にあります：

これは、ドキュメントが完全に読み込まれる（準備完了になる）前に jQuery コードが実行されるのを防ぐためです。つまり、DOM の読み込みが完了した後でのみ DOM を操作できます。

ドキュメントが完全に読み込まれる前に関数を実行すると、操作が失敗する可能性があります。以下に具体的な例を 2 つ示します：

• 存在しない要素を非表示にしようとする
• 完全に読み込まれていない画像のサイズを取得する

ヒント：簡潔な書き方（上記の書き方と同じ効果）：

上記の 2 つの方法のうち、お好みの方法を選択して、ドキュメントの準備完了後に jQuery メソッドを実行できます。