[jQuery]兄弟要素を指定する方法を知りたい

jQueryを勉強しています。

質問があるのですが
結論から言うと
兄弟要素を指定する方法はあるのでしょうか？

親子要素ならfindメソッドを使って子要素をクラス名やタグ名、属性名で指定することができます。
ただ兄弟要素だと指定する方法がわかりません。

prev()やnext()で１個違いを指定するのは知っていますが、2個前などを指定するにはどうしたらいいでしょうか。

prevAll()やnextAll()では以前以後のすべての要素が返ってきてしまいますし、siblings()は兄弟要素すべてを返してしまいます。

よくクリックイベントを使っていて2個上の兄弟要素を指定したいとき、1つのメソッドでうまく指定できる方法があればなと思っています。

$(this).prev().prev();

のようにしたり

テーブルなら
・$(this).parents("tr").find("td").eq(1);
・$(this).parents("tr").find("tdのクラス名")

のように長ったらしくなってしまいます。
find()のように一つのメソッドを書いてその引数に要素のクラス名などを指定する書き方はないでしょうか？

もし分かる方がいれば宜しくお願いします。
もしないならないとお伝え願えればと思います。

行動規範の内容に同意します

回答2件

ベストアンサー

このあたりを使ってフィルタするとかですかね。
http://www.jquerystudy.info/reference/traversing/siblings.html

ただそもそもの話として、解決したいことはなんでしょうか？
というのも、ふたつ上の要素、という指定はちょっとしたHTMLの変更で破綻してしまいますし、実装の設計としてはちょっと問題があるのではないかな、と思ったためです。

例えば操作したい要素をさらにひとつのdivでくるんで、その中の決められた構造において各要素にアクセスする、というふうに設計したほうが後々も問題が出づらいのではないかなと思います。

投稿2015/07/26 06:23

edom18

総合スコア2283

k499778

2015/07/26 13:24

edo_m18さん回答ありがとうございます！ siblings()の引数にクラス名を指定する方法で実現したかったことができました。まさに私がやりたかったことです。ありがとうございました。

行動規範の内容に同意します

... 2個上の兄弟要素 ...

data 属性として "item-0001" ”item-0002" のように対象としたい要素にシーケンシャルな番号を含んだ値を指定しておきます。
クリックでのいイベントハンドラー中で、 this の data 属性値を取得して、 "item-xxxx" ちょっとパースすれば、$(this) のシーケンス番号がえられます。
このシーケンス番号を -2 した値が 1 以上なら、.... なんて様にするのは如何でしょう？
(data 属性でなく、 class 属性を使ってもよいかもしれません)

参考情報：