Sự khác nhau giữa hai câu lệnh jQuery này là gì? Họ dường như làm điều tương tự bằng cách nhận được tất cả các thẻ div trẻ em.Sự khác biệt trực tiếp con cháu (>) so với hậu duệ trong bộ chọn jQuery là gì?
$("#mainblock div")
$("#mainblock > div")
$("#mainblock > div") = các Childs chỉ mức
$("#mainblock div") = tất cả các Childs + desendents.
Nếu nút bạn đang tìm kiếm là một phụ huynh của mainblock, tốt hơn để sử dụng> Ngoài việc chính xác hơn, nó cũng nhanh hơn. – Neil
Người đầu tiên sẽ nhận được tất cả div s hậu duệ của #mainblock. Điều thứ hai sẽ nhận được tất cả div s mà là con trực tiếp của #mainblock
Có một cái nhìn tại jQuery Selectors
Child Selector ("parent > child") - Hierarchy Chọn tất cả các phần tử con trực tiếp theo quy định của "đứa trẻ" của các yếu tố theo quy định của "cha mẹ".
Descendant Selector ("ancestor descendant")- Cấu trúc phân cấp Chọn tất cả các phần tử là hậu duệ của một tổ tiên cụ thể.
$("#mainblock div")
Khớp bất kỳ phần tử div nào là hậu duệ của #mainblock.
$("#mainblock > div")
Khớp bất kỳ phần tử div nào là con của #mainblock.
$("#mainblock div")
Điều này nhắm mục tiêu tất cả các DIV bên trong "#mainblock" cho dù đó là con trực tiếp của "#mainblock" hoặc con của khối chính hoặc vân vân.
$("#mainblock > div")
Điều này sẽ chỉ nhắm mục tiêu con DIV của "#mainblock" và bỏ qua các DIV khác. Điều này nhanh hơn sau đó trong trường hợp bạn chỉ có con trực tiếp. Bởi vì nó không cố gắng tìm thấy bên trong các yếu tố khác của trẻ em.
$ ("# mainblock div") tìm tất cả các divs dưới #mainblock
$ ("# mainblock> div") chỉ được tìm thấy con của nó
giả sử bạn có bên dưới cấu trúc HTML:
<div id="mainblock">
<div>
<div></div>
<div></div>
</div>
<div></div>
<div></div>
</div>
Sau đó
$("#mainblock div").length = 5
$("#mainblock > div").length = 3
tôi không đồng ý với câu hỏi này bị đóng cửa là "quá hẹp."Mọi người đều sử dụng jquery những ngày này và tôi đặt cược phần lớn người dùng không thể cung cấp cho bạn câu trả lời cho câu hỏi này. Làm thế nào là quá hẹp/localized? – agmin