jQuery セレクタ
- 前のページ jQuery 语法
- 次のページ jQuery イベント
選択子は、要素グループまたは単一の要素に対して操作を行うことができます。
jQuery セレクタ
前の章では、HTML要素の選択方法に関するいくつかの例を紹介しました。
重要なポイントは、jQueryの選択子がどのようにして指定したい効果を適用する要素を正確に選択するかを学ぶことです。
jQuery要素選択子および属性選択子は、タグ名、属性名または内容を通じてHTML要素を選択することができます。
選択子は、HTML要素グループまたは単一の要素に対して操作を行うことを許可します。
HTML DOMの用語では：
選択子は、DOM要素グループまたは単一のDOMノードに対して操作を行うことを許可します。
jQuery要素選択子
jQueryは、HTML要素を選択するためにCSS選択子を使用します。
$("p")は、<p>要素を選択します。
$("p.intro")は、class="intro"のすべての<p>要素を選択します。
$("p#demo")は、id="demo"のすべての<p>要素を選択します。
jQuery属性選択子
jQueryは、指定された属性を持つ要素を選択するためにXPath表現を使用します。
$("[href]")は、href属性を持つすべての要素を選択します。
$("[href='#']")は、href値が"#"のすべての要素を選択します。
$("[href!='#']")は、href値が"#"でないすべての要素を選択します。
$("[href$='.jpg']")は、href値が".jpg"で終わるすべての要素を選択します。
jQuery CSS選択子
jQuery CSS選択子は、HTML要素のCSS属性を変更するために使用できます。
以下の例では、すべての<p>要素の背景色を赤に変更しています：
例
$("p").css("background-color","red");
さらに多くの選択子例
| 文法 | 説明 |
|---|---|
| $(this) | 現在のHTML要素 |
| $("p") | すべての<p>要素 |
| $("p.intro") | すべてのclass="intro"の<p>要素 |
| $(".intro") | すべてのclass="intro"の要素 |
| $("#intro") | id="intro"の要素 |
| $("ul li:first") | 各<ul>の最初の<li>要素 |
| $("[href$='.jpg']") | 属性値が".jpg"で終わるすべてのhref属性 |
| $("div#intro .head") | id="intro"の<div>要素内のすべてのclass="head"の要素 |
完全なリファレンスマニュアルが必要な場合は、私たちの jQuery選択子リファレンスマニュアル。
- 前のページ jQuery 语法
- 次のページ jQuery イベント
