94

giả sử tôi có một đánh dấu như thế này:

<div id="foo">
  ...
  <span id="moo">
    ...
  </span>
  ...
</div>

và tôi muốn chọn #moo.

tại sao $('#foo').find('span')hoạt động, nhưng $('span', $('#foo'));không?

jquery jquery-selectors parent-child

— Alex
nguồn

10

Tại sao không $('#moo')? ;) Btw. nó hoạt động: jsfiddle.net/fkling/k5X2r

— Felix Kling

Tôi không' biết tại sao nhưng các chức năng Tôi móc đến khoảng chọn được áp dụng cho tất cả các nhịp trong trang, không chỉ là một bên trong #foo :(

— Alex

2

Còn khi bạn đã có thành phần được chọn trong một var, vì vậy ví dụ bạn bắt đầu với var ele = $("div #foo")cách bạn có thể tới moo từ đây (không sử dụng tài liệu tham khảo mảng)

— Worthy7

129

Bạn có thể sử dụng bất kỳ cái nào trong số này [bắt đầu từ nhanh nhất]

$("#moo") > $("#foo #moo") > $("div#foo span#moo") > $("#foo span") > $("#foo > #moo")

Hãy xem

— Jishnu AP
nguồn

1

Tôi nghĩ cái thứ ba nên là span # moo chứ không phải span # foo?

— xr280xr

60

Trên thực tế, $ ('# id', this); sẽ chọn #id ở bất kỳ cấp con cháu nào, không chỉ cấp con ngay lập tức. Hãy thử cái này thay thế:

$(this).children('#id');

hoặc là

$("#foo > #moo")

hoặc là

$("#foo > span")

— Pranay Rana
nguồn

Điều đó sẽ không chọn bất kỳ thứ gì vì phần tử có ID moo , không phải lớp.

— Felix Kling

3

Điều đáng chú ý là .children()và .find()tương tự, ngoại trừ việc trước đây chỉ đi một cấp xuống cây con DOM.

— Kevin

Nó hoạt động tốt, cảm ơn ;-)

— Ali Lashini

9

Tại sao không chỉ sử dụng:

$("#foo span")

hoặc là

$("#foo > span")

$('span', $('#foo')); hoạt động tốt trên máy của tôi;)

— thợ săn
nguồn

$($(elementA), 'tr#' + key + ' span')không phù hợp với tôi (jQuery 1.10.2)

— Cody

8

Bạn có thể sử dụng findtùy chọn để chọn một phần tử bên trong một phần tử khác. Ví dụ: để tìm một phần tử có id txtName trong một div cụ thể, bạn có thể sử dụng như

var name = $('#div1').find('#txtName').val();

— Sai Kalyan Kumar Akshinthala
nguồn

6

Hãy xem ở đây - để truy vấn phần tử con của một phần tử :

$(document.getElementById('parentid')).find('div#' + divID + ' span.child');

— Cody
nguồn

3

.... but $ ('span', $ ('# foo')); không hoạt động?

Phương thức này được gọi là cung cấp ngữ cảnh bộ chọn .

Trong đó, bạn cung cấp đối số thứ hai cho bộ chọn jQuery . Nó có thể là bất kỳ chuỗi đối tượng css nào giống như bạn chuyển để chọn trực tiếp hoặc một phần tử jQuery.

ví dụ.

$("span",".cont1").css("background", '#F00');

Dòng trên sẽ chọn tất cả các nhịp trong vùng chứa có tên lớp cont1.

BẢN GIỚI THIỆU

— Mohd Abdul Mujib
nguồn

1

cả hai dường như đang hoạt động.

xem fiddle: http://jsfiddle.net/maniator/PSxkS/

— Naftali hay còn gọi là Neal
nguồn

jQuery - chọn các phần tử từ bên trong một phần tử

Hãy xem