>웹 프론트엔드 >JS 튜토리얼 >JavaScript 또는 JQuery가있는 부모 요소에 액세스하십시오

JavaScript 또는 JQuery가있는 부모 요소에 액세스하십시오

Christopher Nolan
Christopher Nolan원래의
2025-02-21 12:01:09428검색

Access a Parent Element With JavaScript or jQuery JavaScript 함수는 일반적으로 DOM의 부모 요소에 대한 액세스가 필요합니다.

JavaScript에서는 를 사용하여 구현할 수 있습니다.

jQuery에서는

를 사용하여 동일한 함수를 달성 할 수 있습니다.

다음은 JavaScript 예입니다 html : element.parentNode

JavaScript :

JavaScript 및 JQuery FAQ (FAQ) javaScript에서 element.parent()

의 차이는 무엇입니까?

JavaScript에서 는 및

모두 특정 요소의 부모 요소에 액세스하는 데 사용됩니다. 그러나 둘 사이에는 뉘앙스가 있습니다.

속성은 요소의 상위 노드를 노드 객체로 반환합니다. 즉, 모든 유형의 노드 (요소 노드, 텍스트 노드, 주석 노드 등)를 반환 할 수 있습니다. 반면에 속성은 상위 노드를 요소 객체로 반환합니다. 즉, 요소 ​​노드 만 반환합니다. 상위 노드가 요소 노드가 아닌 경우

는 를 반환합니다.
<code class="language-html"><ul id="tabs"></ul>
<li class="firsttab"><a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b">one</a></li>
<li class="secondtab"><a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b">two</a></li></code>
jQuery를 사용하여 부모 요소에 액세스하는 방법은 무엇입니까?

jQuery에서는

메소드를 사용하여 선택한 요소의 직접 상위 요소를 얻을 수 있습니다. 예를 들어, ID "child"가있는 요소가있는 경우 다음과 같은 부모 요소에 액세스 할 수 있습니다. 이것은 부모 요소가 포함 된 jQuery 객체를 반환합니다.
<code class="language-javascript">function init() {
  var tablinks = document.getElementById('tabs').getElementsByTagName('a');
  for (var i = 0, j = tablinks.length; i < j; i++) {
    tablinks[i].onclick = doit;
  }
}

function doit() {
  alert(this.parentNode.className);
}

window.onload = init;</code>
JavaScript에서 할아버지 요소 또는 더 높은 수준의 조상 요소에 액세스 할 수 있습니까?

예, 링크 또는 속성을 ​​통해 할아버지 요소 또는 더 높은 수준의 조상 요소에 액세스 할 수 있습니다. 예를 들어, 요소의 할아버지 요소에 액세스하려면

를 사용할 수 있습니다.

부모 요소가 HTML 요소가 아닌 경우 JavaScript는 어떻게됩니까? parentElement 요소의 상위 노드가 HTML 요소가 아닌 경우 (예 : 텍스트 노드 또는 주석 노드 일 수 있음) 속성은 를 반환합니다. 그러나 parentNode 속성은 유형에 관계없이 부모 노드를 계속 반환합니다.

jQuery에서 특정 요소의 모든 조상 요소를 얻는 방법은 무엇입니까?

jQuery에서는 parentElement 메소드를 사용하여 특정 요소의 모든 조상 요소를 얻을 수 있습니다. 예를 들어, parentNode는 id 'child'가있는 요소의 모든 조상 요소를 포함하는 jQuery 객체를 반환합니다. parentNode jQuery를 사용하여 얻은 부모 요소를 필터링 할 수 있습니까?

예, jQuery를 사용하여 얻은 부모 요소를 필터링 할 수 있습니다.

메소드는 모두 선택기를 매개 변수로 받아 들일 수 있으며, 해당 선택기와 일치하는 부모 요소 만 반환합니다. 예를 들어,

는 조상 요소를 div로만 반환합니다. parent() 특정 조건을 충족하는 JavaScript에서 가장 가까운 조상 요소를 얻는 방법은 무엇입니까? parents() JavaScript에서는 $("https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bchild").parents("div") 메소드를 사용하여 특정 조건을 충족하는 가장 가까운 조상 요소를 얻을 수 있습니다. 이 메소드는 선택기를 매개 변수로 받아들이고 선택기와 일치하는 가장 가까운 조상 요소를 반환합니다. 예를 들어,

는 가장 가까운 조상 요소를 div로 반환합니다.

에서

방법의 차이점은 무엇입니까? closest() jQuery에서 메소드는 특정 조건을 충족하는 모든 조상 요소를 반환하는 반면, element.closest("div") 메소드는 조건을 충족하는 가장 가까운 조상 요소 만 반환합니다. 따라서 가장 가까운 일치 조상 만 필요하면

를 사용하십시오. 일치하는 모든 조상이 필요한 경우

를 사용하십시오. parents() JavaScript에서 텍스트 노드 또는 주석 노드의 부모 요소에 액세스 할 수 있습니까? closest() 예, 속성을 ​​사용하여 텍스트 노드의 상위 요소에 액세스하거나 javaScript에서 주석 노드에 액세스 할 수 있습니다. 이 속성은 텍스트 노드 및 주석 노드를 포함하여 모든 유형의 노드의 상위 노드를 반환합니다.

요소가 JavaScript에 부모 요소가 있는지 확인하는 방법은 무엇입니까?

javaScript에서는 또는 parents() 속성을 ​​사용하여 요소에 부모 요소가 있는지 확인할 수 있습니다. 요소에 부모 요소가있는 경우 이러한 속성은 부모 요소 또는 노드를 반환합니다. 요소에 부모 요소가 없으면 이러한 속성은 closest()를 반환합니다. 따라서 또는 와 같은 조건을 사용하여 요소에 부모 요소가 있는지 확인할 수 있습니다. closest()

위 내용은 JavaScript 또는 JQuery가있는 부모 요소에 액세스하십시오의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.