jQuery-요소 내부에서 요소 선택

jQuery-요소 내부에서 요소 선택

---

다음과 같은 마크 업이 있다고 가정 해 보겠습니다.

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

#moo를 선택하고 싶어요.

왜 $('#foo').find('span')작동하지만 $('span', $('#foo'));그렇지 않습니까?

---

이 중 하나를 사용할 수 있습니다 [가장 빠른 것부터 시작]

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

구경하다

---

사실, $ ( '# id', this); 직계 자식뿐만 아니라 모든 하위 수준에서 #id를 선택합니다. 대신 이것을 시도하십시오.

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

또는

$("#foo > #moo")

또는

$("#foo > span")

---

그냥 사용하지 않는 이유 :

$("#foo span")

또는

$("#foo > span")

---

$('span', $('#foo')); 내 컴퓨터에서 잘 작동합니다.)

---

여기를보세요- 요소의 하위 요소를 쿼리하려면 :

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

---

find옵션을 사용 하여 다른 요소 내부의 요소를 선택할 수 있습니다 . 예를 들어 특정 div에서 id가 txtName 인 요소를 찾으 려면 다음과 같이 사용할 수 있습니다.

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

---

....하지만 $ ( 'span', $ ( '# foo')); 작동하지 않습니까?

이 메서드는 선택자 컨텍스트 제공이라고 합니다.

여기 에서 jQuery 선택기에 두 번째 인수를 제공합니다 . 직접 선택 또는 jQuery 요소를 위해 전달하는 것처럼 CSS 객체 문자열이 될 수 있습니다.

예.

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

위의 줄은라는 클래스를 가진 컨테이너 내의 모든 범위를 선택합니다 cont1.

데모

---

둘 다 작동하는 것 같습니다.

바이올린 참조 : http://jsfiddle.net/maniator/PSxkS/

참고 URL : https://stackoverflow.com/questions/5808606/jquery-selecting-elements-from-inside-a-element