jQueryの基礎、基本文法

理解するコツ

・大目的:HTML/CSSとロジックを分離
・HTML/CSS要素(タグ、id、class)をベースとする
・「$」は、jQueryの関数
・セレクタを引数にして要素をオブジェクトにする
・要素オブジェクトに、プロパティやメソッドを「.」でつなぐ
・「$(document).ready(function(){}」が必要なのは、ページが読み込まれた時点で、イベントハンドラを要素に設定するため →HTMLとロジックを分離できる
・非表示は「display:none;」を使用するなど、CSSと有機的に結びついている

JavaScriptとjQueryの関係

・jQueryは、JavaScriptのライブラリ
・言語としては、あくまでJavaScript
・変数、演算子、制御命令、関数、コメントは、JavaScriptそのまま

jQuery関数

・jQueryライブラリで、「$」が関数として定義されている
・「$」は、セレクタを引数にする
・他のライブラリと衝突する場合は、「$」は「jQuery」でも代用可

要素オブジェクト

セレクタを$関数の引数にすることによって、要素をオブジェクト化する

※セレクタ …タグ、ID、クラス


$('#msg')

メソッドをチェイン

複数のメソッドを「.」でつなぐ(チェイン)ことができる

$('#msg').text('Hello World').css('color','red');