Sự khác biệt giữa không gian và bộ chọn của jQuery là gì?

Question

Sự khác biệt giữa bộ chọn space và > là gì? Và có thể liên quan, làm thế nào tôi có thể tìm cái gì đó là con trực tiếp của cái gì khác, và không thấp hơn dòng hậu duệ?

Answer 1

Mục đích:

<ul> 
    <li>Item 1</li> 
    <li>Item 2 
    <ul> 
     <li>Item 2.1</li> 
     <li>Item 2.2</li> 
    </ul> 
    </li> 
    <li>Item 3</li> 
</ul> 

Ví dụ

$("ul > li").addClass("blah"); 

thêm lớp "blah" tới 1 2 và 3 trong khi:

$("ul li").addClass("blah"); 

add class "blah" để mọi phần tử danh sách .

Tôi không chắc chắn những gì bạn đang đề cập đến với < và? toán tử.

Answer 2

Trong CSS, > có nghĩa là "con trực tiếp": chỉ các nút là con trực tiếp được chọn.

Mặc dù không gian có nghĩa là "bất kỳ hậu duệ nào": trực tiếp trẻ em và trẻ em của những trẻ đó có thể được chọn.

Tôi sẽ đặt cược jQuery sử dụng cùng một quy ước.

Answer 3

Như đã đề cập, một không gian sẽ chọn bất kỳ hậu duệ nào, trong khi > sẽ chỉ chọn các trẻ em ngay lập tức. Nếu bạn muốn chọn duy nhất cháu hoặc chắt, sau đó bạn có thể sử dụng này:

#foo > * > * > .bar 

(tất cả các yếu tố với lớp "thanh", mà là chắt của nguyên tố này với id "foo")

Answer 4

nhìn vào điều này ..

$(".testit > a") //match the first <a> tag below 
$(".testit a") // matches all <a> tag below 

<p class="testit"> 
    <a href="#">All the rules will match this</a> 
    <span> 
    <a href="#">second rule can only select this</a> 
    </span> 
</p>