find

参考:

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

.find() | jQuery API Documentation [Official]

prev

直前の要素を選択する。

const $prev = $('#current').prev()
Code language: JavaScript (javascript)

参考:

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

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

.prev() | jQuery API Documentation [Official]

next

直後の要素を選択する。

const $next = $('#current').next()
Code language: JavaScript (javascript)

参考:

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

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

.next() | jQuery API Documentation [Official]

closest

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

const $parent = $('#current').closest()
Code language: JavaScript (javascript)

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

const $list = $('#current-item').closest('ul')
Code language: JavaScript (javascript)

参考:

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

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

.closest() | jQuery API Documentation [Official]

siblings

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

const $siblings = $('#current').siblings()
Code language: JavaScript (javascript)

参考:

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-child1つの親につき1つマッチするため、結果が複数の要素になる可能性がある。
  • :first選択される要素は常に最大で1つ

参考:

:first Selector | jQuery API Documentation [Official]

first()

最初の要素を選択する。

const first_item = $('#items li').first()
Code language: JavaScript (javascript)

参考:

.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 (archive)

正規表現で絞り込む

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

jQuery.expr[":"].regex = function (elem, index, match) { let 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)); };
Code language: JavaScript (javascript)

参考:

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

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

Regex Selector for jQuery | James Padolsey (archive)

jQuery selector regular expressions – Stack Overflow

find と filter の違い

参考:

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

jQuery の filter と find の違い | しんや Blog

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

.find() | jQuery API Documentation [Official]

.filter() | jQuery API Documentation [Official]

記事をシェアする:
タグ:

コメントを残す

メールアドレスが公開されることはありません。

Protected by reCAPTCHA