jQuery グラマー

jQuery を使用して、HTML 元素を選択（クエリ、query）し、それに対する「操作」（actions）を実行できます。

jQuery 语法の例

$("this").hide()
jQuery hide() 函数のデモンストレーション、現在の HTML 元素を非表示にします。
$("#test").hide()
jQuery hide() 函数のデモンストレーション、id="test" の要素を非表示にします。
$("p").hide()
jQuery hide() 函数のデモンストレーション、<p> 元素を非表示にします。
$(".test").hide()
jQuery hide() 函数のデモンストレーション、class="test" のすべての要素を非表示にします。

jQuery グラマー

jQuery の语法は、HTML 元素の選択に编制されており、それに対する操作を実行できます。

基本的な语法は：$("selector").action()

  • ドル記号は jQuery を定義します
  • 選択子（selector）は、HTML 元素を「クエリ」および「検索」するために使用されます
  • jQuery の action() は、要素に対する操作を実行します

例

$("this").hide() - 現在の要素を非表示にします

$("p").hide() - すべての段落を非表示にします

$(".test").hide() - class="test" のすべての要素を非表示にします

$("#test").hide() - id="test" のすべての要素を非表示にします

ヒント：jQuery が使用する语法は、XPath と CSS 选择子語法の組み合わせです。このトレーニングの次の章で、選択子の语法についても学びます。

ドキュメントが準備できた関数

おそらくすでに気づいたかもしれませんが、私たちの例ではすべての jQuery 関数が document ready 関数内にあります：

$(document).ready(function(){
  // jQuery 関数はここに記述されます
});

これは、ドキュメントが完全に読み込まれる（準備ができた）前に jQuery コードを実行することを防ぐためです。

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

  • 存在しない要素を隠そうとする
  • 未完全読み込まれた画像のサイズを取得する