jQueryセレクター
jQueryセレクターは、jQueryライブラリーの最も重要な部分の1つです。
jQueryセレクター
jQueryセレクターを使用すると、HTML要素を選択して操作できます。
jQueryセレクターは、名前、ID、クラス、タイプ、属性、属性の値などに基づいてHTML要素を「検索」(または選択)するために使用されます。CSSセレクター、さらに、いくつかの独自のカスタムセレクターがあります。
jQueryのすべてのセレクターは、ドル記号と括弧$()で始まります。
要素セレクター
jQuery要素セレクターは、要素名に基づいて要素を選択します。
次のように、ページ上のすべての<p>
要素を選択できます。
例
ユーザーがボタンをクリックすると、すべて<p>
要素は非表示になります。
#idセレクター
jQuery#id
セレクターは、HTMLタグのid属性を使用して特定の要素を見つけます。
idはページ内で一意である必要があるため、単一の一意の要素を見つけたい場合は#idセレクターを使用する必要があります。
特定のIDを持つ要素を見つけるには、ハッシュ文字を書き、その後にHTML要素のIDを続けます。
例
ユーザーがボタンをクリックすると、id="test"を持つ要素が非表示になります。
.classセレクター
jQueryの.class
セレクターは、特定のクラスを持つ要素を見つけます。
特定のクラスの要素を検索するには、ピリオド文字を書き、その後にクラスの名前を続けます。
例
ユーザーがボタンをクリックすると、class="test"を持つ要素が非表示になります。
jQueryセレクターのその他の例
jQueryセレクターテスターを使用し、さまざまなセレクターのデモを行って下さい。
すべてのjQueryセレクターの完全なリファレンスについては、jQueryセレクターリファレンスを参照してください。
別ファイルの関数
Webサイトに多くのページが含まれており、jQuery関数の保守を容易にしたい場合は、jQuery関数を別の.jsファイルに入れることができます。
このチュートリアルでjQueryをデモンストレーションするとき、関数は直接<head>
セクションに直接追加されます。ただし、次のように別のファイルに配置する方が望ましい場合もあります (.jsファイルを参照するにはsrc属性を使用します)。
例
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。