find

参考:

find(expr) | jQuery 日本語リファレンス (semooh.jp)

.find() | jQuery API Documentation [Official]

prev

直前の要素を選択する。

const $prev = $('#current').prev()

参考:

prev([expr]) | jQuery 日本語リファレンス (semooh.jp)

prev | jQuery リファレンス (jquerystudy.info)

.prev() | jQuery API Documentation [Official]

next

直後の要素を選択する。

const $next = $('#current').next()

参考:

next([expr]) | jQuery 日本語リファレンス (semooh.jp)

next | jQuery リファレンス (jquerystudy.info)

.next() | jQuery API Documentation [Official]

closest

最も近い親要素を選択する。

const $parent = $('#current').closest()

セレクタが指定された場合は、セレクタに合致する最も近い親要素を選択する。

const $list = $('#current-item').closest('ul')

参考:

closest([expr]) | jQuery 日本語リファレンス (semooh.jp)

parent()・parents()・closest() の違い – Qiita

.closest() | jQuery API Documentation [Official]

siblings

兄弟要素 (同じ階層の要素) を選択する。セレクタが指定された場合は、セレクタに合致する兄弟要素を選択する。

const $siblings = $('#current').siblings()

参考:

siblings(expr) | jQuery 日本語リファレンス (semooh.jp)

.siblings() | jQuery 1.9 日本語リファレンス (js STUDIO)

siblings | jQuery リファレンス (jquerystudy.info)

siblings( [selector] ) | jQuery API 日本語リファレンス (alphasis.info)

.siblings() | jQuery API Documentation [Official]

siblings Selector | W3Schools

children

参考:

children([expr]) | jQuery 日本語リファレンス (semooh.jp)

.children() | jQuery API Documentation [Official]

:first

最初の要素を選択する。:eq(0) もしくは :lt(1)と同じ。

:first-child は一つの親について一つマッチするため、結果が複数の要素になる可能性があるのに対し、:first-child で選択される要素は常に最大で一つだけである。

参考:

:first Selector | jQuery API Documentation [Official]

first()

最初の要素を選択する。

const first_item = $('#items li').first()

参考:

.first() | jQuery API Documentation [Official]

擬似要素

参考:

Selecting and manipulating CSS pseudo-elements such as ::before and ::after using jQuery – Stack Overflow

JQuery select pseudo-element :after – Stack Overflow

配列を取得する

参考:

get() | jQuery 日本語リファレンス (semooh.jp)

.toArray() | jQuery API Documentation [Official]

.get() | jQuery API Documentation [Official]

単一の要素を取得する

参考:

jQuery オブジェクトと DOM エレメントの変換 | Please Sleep

get(index) | jQuery 日本語リファレンス (semooh.jp)

.get(index) | jQuery API Documentation [Official]

フィルタを拡張する

参考:

Extending jQuery’s selector capabilities | James Padolsey

正規表現で絞り込む

正規表現フィルタを追加する。

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));
}

参考:

調子に乗って正規表現で filter(function(){~ しまくってみる | ちゅんもす置き場

jQuery のセレクタに正規表現・属性フィルタを使う方法!| 侍エンジニア塾ブログ

Regex Selector for jQuery | James Padolsey

jQuery selector regular expressions – Stack Overflow

find と filter の違い

参考:

find() と filter() の違い | 感謝のプログラミング

うおーーー! 教えて頂いたことに感謝の気持ちをどう伝えたらいいか分からないw | ひよっこ PG のブログ

.find() | jQuery API Documentation [Official]

.filter() | jQuery API Documentation [Official]

タグ:

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です