Voici un HTML presque identique à celui d'avant. En plus, le troisième div contient un enfant p avec la classe third.

<html>
  <body>
    <div id = 'first'>
      <h1 class = 'big'>Berlin Weather Station</h1>
      <p class = 'first'>Temperature: 20°C</p>
      <p class = 'second'>Humidity: 45%</p>
    </div>
    <div id = 'second'>...</div>
    <div id = 'third'>
      <p class = 'first'>Sunshine: 5hrs</p>
      <p class = 'second'>Precipitation: 0mm</p>
      <p class = 'third'>Snowfall: 0mm</p>
    </div>
  </body>
</html>

Avec XPATH, on peut faire quelque chose d’impossible en CSS : sélectionner des éléments en fonction des propriétés de leurs descendants. Pour cela, on utilise des prédicats. Ici, votre objectif final est de sélectionner uniquement les éléments div qui contiennent un élément p avec la classe third. Pour y parvenir, vous devez sélectionner uniquement le div qui correspond à un certain prédicat — avoir le descendant correspondant (il n’a pas besoin d’être un enfant direct). Vous allez procéder étape par étape.

Encore une fois, le HTML ci-dessus est fourni dans weather_html.

Fonctions XPATH et prédicats avancés

Create Your Free Account