1. ホーム
  2. javascript

[解決済み] jQueryでクラスセレクタと属性セレクタを組み合わせる

2022-04-21 12:52:52

質問

クラスセレクタと jQueryで属性セレクタを使用することはできますか?

例えば、以下のようなHTMLがあった場合。

<TABLE>
  <TR class="myclass" reference="12345"><TD>Row 1</TD></TR>
  <TR class="otherclass" reference="12345"><TD>Row 2</TD></TR>
  <TR class="myclass" reference="12345"><TD>Row 3</TD></TR>
  <TR class="myclass" reference="54321"><TD>Row 4</TD></TR>
</TABLE>

1行目と3行目のみを選択するセレクタは何ですか?

試してみました。

$(".myclass [reference=12345]") // returns nothing

$(".myclass, [reference=12345]") // returns all 4 rows (yes, I know the comma means 'or')

答えはとてもシンプルで、jQueryのフォーラムやドキュメントを検索してみたのですが、これがどうしても分かりません。どなたか助けていただけませんか?

どのように解決するのですか?

合体させる。文字どおり 組み合わせる それらを 付ける を句読点なしでつなげます。

$('.myclass[reference="12345"]')

最初のセレクタは、クラスを持つ要素に含まれる、属性値を持つ要素を探します。

スペースは 子孫セレクタ .

2番目のセレクタは、あなたが言ったように、属性値かクラスのどちらか、または両方を持つ要素を探します。

カンマは 複数セレクタ 演算子 - それがどんな意味であれ (CSS セレクタには "operators" という概念がありません。カンマはおそらく区切り文字としてより正確に知られています)。