집 >웹 프론트엔드 >JS 튜토리얼 >Jquery에서 부모와 부모의 차이점을 공유하십시오.

Jquery에서 부모와 부모의 차이점을 공유하십시오.

黄舟원래의: 2017-06-23 15:32:481658검색

현재 요소의 상위 요소인 parent의 값이 매우 명확하다는 것을 알 수 있습니다. parent는 현재 요소의 조상 요소입니다. 예는 다음과 같습니다.

<p id=&#39;p1&#39;>
<p id=&#39;p2&#39;><p></p></p>
<p id=&#39;p3&#39; class=&#39;a&#39;><p></p></p>
<p id=&#39;p4&#39;><p></p></p>
</p>

$('p').parent()는 p2, p3, p4
$('p').parent('.a')는 p3
$('p')를 가져옵니다. parent().parent()는 p1을 얻습니다. 이는 다소 이상하지만 Jquery object 자체의 특성에 따라 이것이 가능하다고 결정됩니다.
$('p').parents()는 p1, p2, p3, p4를 가져옵니다
$('p').parents('.a')는 p3을 가져옵니다
parent(exp) 사용법: 가져오기 일치하는 모든 요소의 고유한 상위 요소입니다.

<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script type="text/javascript"> 
$(document).ready(function() {
$("#btn1").click(function(){
alert($(this).parent().next().html());
});
});
</script> 
</head> 
<body> 
<table>
<tr>
      <td><input id="btn1"  class="btn" type="button"  value="test" /></td>
      <td>some text</td>
</tr>
</table>

그 중:
this.parent()는 input
this.parent().parent()가 tr
this.parent().parent().parent()를 가져오고 table
this를 가져오는 앞의 td입니다. parent().next()는 td
다음에 있는 td를 가져옵니다. 예에서:

<p><p>Hello</p><p>Hello</p></p>

$("p").parent()는 다음을 가져옵니다: e388a4556c0f65e1904146cc1a846beee388a4556c0f65e1904146cc1a846beeHello78db4759a09894ef0af975234662f5ca94b3e26ee717c64999d7867364b1b4a3 객체입니다. p 태그의 상위 태그는 p

jquery의 parent()가

를 사용하기 때문에 오늘 흥미로운 문제가 발생했습니다. jquery에는 parent()와 parent()라는 두 가지 기능이 있습니다. ) 이 두 함수를 통해 jquery의 선택기라고도 하는 개체의 상위 개체를 찾을 수 있습니다. 예를 들어,

<body>
<div id="one">
<div id="two">hello</div>
<div id="three">
<p>
<a href="#">tonsh</a>
</p>
</div>
</div>

$("a").parent()는 상위 개체를 가져옵니다e388a4556c0f65e1904146cc1a846bee
$("a").parents()는 상위 개체를

$("a").parents().filter("div")는 dc0c0bf950c16358990a944092168089dd1ad21d926ab3d81e0b74863b822d1b을 가져오며 $("a"로 쓸 수도 있습니다. ).부모("div").
0d2b8ff6d648b89a944975f20a7117fa 개체를 원하는 경우 $("a").parents("div:eq(0)")와 같이 작성할 수 있습니다.
3499910bf9dac5ae3c52d5ede7383485 링크를 클릭했을 때 0d2b8ff6d648b89a944975f20a7117fa의 콘텐츠가 나타나면 어떻게 해야 하나요?

var id=$("a").parents("div:eq(1)").children("div:eq(0)").html(); 
alert(id);

위 내용은 Jquery에서 부모와 부모의 차이점을 공유하십시오.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명：

이전 기사：jQuery 선택기 입력과 :input의 차이점다음 기사：jQuery 선택기 입력과 :input의 차이점