XPath Axis: Enhance your skills by practicing XPath Child,Descendent,Descendant-or-self,Following axis syntax with our given sample HTML codes and interactive exercises, designed to help you master selecting elements in HTML and XML documents.

Boost Your Skills: Practice XPath Syntax with easy Exercises.

Home → Practice 9

 Next Exercise >>
Step 1: Read XPath Question → Step 2: Check HTML Source Code → Step 3: Enter XPath Syntax in O/P Box

XPath Exercise 9

Q1. Find all Child Text from Div ID="elephant" using Child axis.

Q2. Find all Child Paragraph Text from Div ID="malewildanimal" using Child axis.

Q3. Find all Child Paragraph Text from Div ID="animal" using Child axis.

Q4. Find all Descendent Paragraph Text from Div ID="animal" using Descendent axis.

Q5. Find all Descendent Paragraph Text from Div ID="malewildanimal" using Descendent axis.

Q6. Find all Paragraph Text from Div ID="malewildanimal" using Descendant-or-self axis.

Q7. Find all Paragraph Text from Div ID="lion" using Following axis.

Q8. Find all Paragraph Text from Div ID="lion" using Following axis.

HTML Source Document

<div id="animal">
  <p>Animal</p>
  <div id="wildanimal">
    <p>Wild Animal</p>
    <div id="malewildanimal">
      <p>Male Wild Animal</p>
      <div id="lion">
        <p>Lion</p>
      </div>
      <div id="elephant">
        <p>Elephant</p>
        <div id="elephant1">
          <p>Elephant 1</p>
        </div>
        <div id="elephant2">
          <p>Elephant 2</p>
        </div>
      </div>
    </div>
  </div>
</div>

XPath O/P Box

Enter XPath Syntax here:

XPath Tips and Syntax For This Page Exercise:

Using Child Axis

//child::tagName
e.g. //div[@class='Mammal']/child::div

The child axis selects direct children of an element.

Using Descendent Axis

//div[@class='Animal']/descendant::div

Selects all nested elements regardless of depth.

Using Descendant-or-self Axis

//div[@class='signup_form new']//descendant-or-self::div

Selects the current element and all its descendants.

Using Following Axis

//div[@class='Mammal']/following::div

Selects all elements after the current one in document order.

We would love to hear your thoughts, suggestions, concerns or problems with anything so we can improve. Please use the Social Media button on the right side to help this website grow.