1. ホーム
  2. javascript

[解決済み] HTML5を使用したカスタムデータ属性のjQueryセレクタ

2022-03-14 04:16:19

質問

HTML5に付属するこれらのデータ属性に利用可能なセレクタを知りたいのですが。

このHTMLの一部を例にとって説明します。

<ul data-group="Companies">
  <li data-company="Microsoft"></li>
  <li data-company="Google"></li>
  <li data-company ="Facebook"></li>
</ul>

取得するセレクタはありますか。

  • すべての要素に data-company="Microsoft" 以下 "Companies"
  • を持つすべての要素は data-company!="Microsoft" 以下 "Companies"
  • その他の場合は、"contains, less than, greater than, etc."のような他のセレクタを使用することは可能ですか?

解決方法は?

$("ul[data-group='Companies'] li[data-company='Microsoft']") //Get all elements with data-company="Microsoft" below "Companies"

$("ul[data-group='Companies'] li:not([data-company='Microsoft'])") //get all elements with data-company!="Microsoft" below "Companies"

をご覧ください。 jQuery セレクタ :contains はセレクタです。

に関する情報はこちらです。 :contains セレクタ