하위 노드 선택
//*[@class='class-name'] 아래의 모든 하위 노드를 선택하려면, 해당 XPath에서 하위 노드를 포함하는 경로를 작성해야 합니다.
모든 하위 노드를 선택하려면 //*을 추가해 주면 됩니다. 따라서 하위 노드를 선택하는 XPath는 다음과 같습니다.
//*[@class='class-name']//*
이 XPath는 class 속성이 'class-name'인 요소의 모든 하위 요소를 선택합니다.
예시
- 만약
sclass-name 클래스가 다음과 같은 HTML 구조로 되어 있다면:
<div class="class-name">
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<p>Some text</p>
</div>
위 XPath는 <ul>, <li>, <p> 같은 모든 하위 요소들을 선택할 수 있습니다.
이 방법으로 하위 노드를 선택할 수 있어요!
직계 하위 노드 선택
직계 하위 노드만 선택하려면, //* 대신에 /를 사용해야 합니다. //*[@class='class-name'] 요소의 직계 하위 노드를 선택하려면 다음과 같은 XPath를 사용합니다.
//*[@class='class-name']/*
이 XPath는 class가 'class-name'인 요소의 직계 하위 요소들만 선택합니다.
예시
<div class="class-name">
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<p>Some text</p>
</div>
위의 경우, <ul>과 <p>가 선택됩니다. li는 직계 하위 요소가 아니므로 선택되지 않습니다.
즉, /*를 사용하면 첫 번째 수준의 하위 노드만 선택할 수 있습니다.