适用于兄弟姐妹/儿童/家长的JQuery选择器

Question

So I feel like my title is almost ambiguous but the truth is I'm not even sure how to clarify...hence the question.

Html

<tr>  
  <div class="thisis(this)inmyexample"></div>
  <div class="stuff">
    <div class="foo"></div>
  </div>
</tr>

My question is on the difference in selectors. Let's assume that .stuff is a sibling of $(this) If I use this:

$(this).closest('tr').find('.stuff .foo')

Now, I realize this isn't efficient coding but it's just as an easy example. With it, I will find all classes of .foo that are children of .stuff .

If I use this:

$(this).siblings('.stuff .foo')

I won't find anything. This is my inexperience with jquery talking, probably, but why wouldn't that kind of selector (what do you call a selector that uses a space or has both together, like '.stuff.foo' ?) work with something like .siblings? My expectation is that it would find all siblings with the class of .stuff and then find all children of .stuff with a class of .foo . Is it not working because siblings/children/parent is looking for just the sibling/parent/child and won't look past that?

I know I can use this:

$(this).siblings('.stuff').children('.foo')

and I achieve my goal. I'm just curious why my above selector (if that's what it's properly called) wouldn't work.

Thanks in advance!

Answer 1

你回答了自己的问题，你找不到任何与$（this）.siblings（'。stuff .foo'）的东西，因为.foo不是$（这个）的兄弟，它有点像'孙子'。选择器，它会查找.foo兄弟姐妹，它们有.stuff父母，而你有$（这个），.stuff和.foo的兄弟，.stuff的孩子，而不是$（这个）的兄弟。