Home / , / Come selezionare l’ XPath

Come selezionare l’ XPath

533 views 1 min , 52 sec read

Spesso per posizionare Recommendation e Behavioural Message, è necessario ricavare l’ XPath dal proprio sito. Prima di vedere come prelevare questo percorso è necessario spiegare che cosa è l’ XPath.

Cos’è l’XPath?

L’ XPath (XML Path Language) è un linguaggio che permette di attraversare la struttura, DOM (Document Object Model), di una pagina Web e di raggiungere quindi, indicandone il percorso, un elemento specifico della nostra pagina.

Il percorso di un determinato elemento della pagina può essere indicato in vari modi, pertanto questa tecnologia è  estremamente flessibile e potente nei casi in cui si voglia manipolare una pagina web senza, in realtà, dover intervenire direttamente sul proprio sito.
Vediamo le varie metodologie di prelievo dell’ XPath.

Come ricavare l’ XPath?

Utilizzare l’inspector del browser

Per poter ricavare l’ XPath basterà utilizzare un comune browser come Google Chrome o Firefox.
In questo caso, ti mostriamo passo passo come prelevare l’ XPath tramite Google Chrome.
Dopo aver individuato l’area in cui desideri posizionare il tuo elemento, clicca con il tasto destro del mouse e seleziona “Ispeziona”.

Comparirà una console di analisi in cui la zona di tuo interesse risulterà evidenziata in blu.

Cliccando con il tasto destro nella zona selezionata di blu, si aprirà un menù a tendina in cui puoi selezionare “copy” e successivamente “copy XPath”.

Ricavare l’ XPath tramite un id univoco.

È possibile fornire l’ XPath in modo molto semplice se l’ elemento che vogliamo selezionare possiede un id univoco. Vediamo l’esempio.

<!DOCTYPE html>
<html>
  <head>
    <title>Xpath</title>
  </head>
  <body>
    <header>
      <h1 id="page_title">Anagrafica Utente</h1>
      <div>
        <h3>Giovanni Rossi</h3>
      </div>
    </header>
  </body>
<html>

In questo esempio possiamo selezionare l’elemento <h1> con id univoco id=”page_title” semplicemente così

//*[@id='page_title']

Ricavare l’XPath tramite una classe univoca.

Allo stesso modo in cui ricaviamo l’ XPath tramite l’id possiamo selezionare l’elemento anche tramite la sua classe. Vediamo l’ esempio.

<!DOCTYPE html>
<html>
  <head>
    <title>Xpath</title>
  </head>
  <body>
    <section class="page_body">
      <h4>Indirizzo</h4>
      <div>
        <ul>
          <li class="page_street">Via della Repubblica 3</li>
          <li>52100, Arezzo</li>
          <li class="page_country" id="italy">Italia</li>
        </ul>
      </div>
    </section>		
  </body>
<html>

In questo esempio se volessimo selezionare l’elemento <li> con la classe “page_street” basterà utilizzare la seguente sintassi:

//*[contains(concat(' ', normalize-space(@class), ' '), ' page_street ')]

A differenza dell’id, che è per definizione univoco per l’intera pagina web, la classe potrebbe non essere univoca, pertanto occorre fare molta attenzione nell’utilizzo di questo metodo.
Inoltre un elemento può possedere più di una classe, per tale motivo in questo caso è preferibile utilizzare la funzionalità “contains” invece di inserire il valore esatto.

Dopo aver selezionato correttamente l’ XPath di tuo interesse, puoi utilizzarlo nella configurazione di Product Recommendation e Behavioral Message.

Per approfondire, non perderti altri articoli: Introduzione alle Product Recommendation e  Introduzione ai Behavioural Message.

Was this content useful?

Thanks for contributing!

Yes No