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

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

黄舟
풀어 주다: 2017-06-23 15:32:48
원래의
1659명이 탐색했습니다.

현재 요소의 상위 요소인 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을 얻습니다. 이는 다소 이상하지만 Jqueryobject 자체의 특성에 따라 이것이 가능하다고 결정됩니다.
$('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()는 다음을 가져옵니다:

Hello

객체입니다. 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()는 상위 개체를 가져옵니다


$("a").parents()는 상위 개체를


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


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

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿