セレクタ
参考:
Selectors | jQuery 日本語リファレンス (semooh.jp)
使い方
参考:
子孫セレクタ
ul
要素内の li
要素を抽出する。
$('ul li')
参考:
ancestor descendant | jQuery 日本語リファレンス (semooh.jp)
複数の属性
$('[attr1="val1"][attr2="val2"]')
参考:
複数の属性 | jQuery リファレンス (jquerystudy.info)
前方一致/後方一致
属性の前方一致には ^=
を使う。
$('[attr^="val"]')
属性の後方一致には $=
を使う。
$('[attr^="val"]')
参考:
jQuery の属性セレクタで前方・後方・部分一致を使って要素を取得する | EC のウェブ担当者のメモ
jQuery で文字列の前方一致や後方一致を判別する方法 | ONE NOTES
[ 属性名 ^= ‘値’ ] | jQuery リファレンス (.jquerystudy.info)
jQuery の class 前方一致で詰まった – Qiita
data 属性
参考:
data 属性に特定の値を持つ要素を指定する方法。| うぇぶろぐらまーな日誌
:data
参考:
大文字小文字を区別しない
参考:
CSS selector case insensitive for attributes – Stack Overflow
正規表現を使う
- jQuery の
each
内で判定する - jQuery の
filter
内で判定する
参考:
jQuery のセレクタに正規表現・属性フィルタを使う方法!| 侍エンジニア塾ブログ
jQuery に正規表現セレクタを追加する
次の関数を追加することで、:regex
が使えるようになる。
jQuery.expr[':'].regex = function(elem, index, match) { var matchParams = match[3].split(','), validLabels = /^(data|css):/, attr = { method: matchParams[0].match(validLabels) ? matchParams[0].split(':')[0] : 'attr', property: matchParams.shift().replace(validLabels,'') }, regexFlags = 'ig', regex = new RegExp(matchParams.join('').replace(/^\s+|\s+$/g,''), regexFlags); return regex.test(jQuery(elem)[attr.method](attr.property)); }
(出典:James Padolsey)
クラス名に -hoge-
を含む要素を抽出する。
$(":regex(class, .*-hoge-.*)")
参考: