Χρησιμοποιώντας XPath και σελήνιο για να βρείτε ένα στοιχείο στη σελίδα HTML

Ο εντοπισμός και η επιλογή στοιχείων από την ιστοσελίδα είναι το κλειδί για την απόξεση ιστού με το Selenium. Για τον εντοπισμό και την επιλογή στοιχείων από την ιστοσελίδα, μπορείτε να χρησιμοποιήσετε επιλογείς XPath στο Σελήνιο.

Σε αυτό το άρθρο, θα σας δείξω πώς μπορείτε να εντοπίσετε και να επιλέξετε στοιχεία από ιστοσελίδες χρησιμοποιώντας επιλογείς XPath στο Selenium με τη βιβλιοθήκη python Selenium. Λοιπόν, ας ξεκινήσουμε.

Προαπαιτούμενα:

Για να δοκιμάσετε τις εντολές και τα παραδείγματα αυτού του άρθρου, πρέπει να έχετε,

1. Μια διανομή Linux (κατά προτίμηση Ubuntu) εγκατεστημένη στον υπολογιστή σας.
2. Python 3 εγκατεστημένο στον υπολογιστή σας.
3. Το PIP 3 είναι εγκατεστημένο στον υπολογιστή σας.
4. Πύθων virtualenv πακέτο εγκατεστημένο στον υπολογιστή σας.
5. Τα προγράμματα περιήγησης Mozilla Firefox ή Google Chrome είναι εγκατεστημένα στον υπολογιστή σας.
6. Πρέπει να γνωρίζετε πώς να εγκαταστήσετε το πρόγραμμα οδήγησης Firefox Gecko ή το πρόγραμμα οδήγησης Chrome Web.

Για την εκπλήρωση των απαιτήσεων 4, 5 και 6, διαβάστε το άρθρο μου Εισαγωγή στο σελήνιο στην Python 3 Το Μπορείτε να βρείτε πολλά άρθρα για τα άλλα θέματα LinuxHint.com Το Φροντίστε να τα ελέγξετε αν χρειάζεστε βοήθεια.

Δημιουργία καταλόγου έργου:

Για να διατηρήσετε τα πάντα οργανωμένα, δημιουργήστε έναν νέο κατάλογο έργου σελήνιο-xpath/ ως εξής:

Πλοηγηθείτε στο σελήνιο-xpath/ κατάλογος έργου ως εξής:

Δημιουργήστε ένα εικονικό περιβάλλον Python στον κατάλογο έργου ως εξής:

Ενεργοποιήστε το εικονικό περιβάλλον ως εξής:

Εγκαταστήστε τη βιβλιοθήκη Selenium Python χρησιμοποιώντας το PIP3 ως εξής:

Κατεβάστε και εγκαταστήστε όλα τα απαιτούμενα προγράμματα οδήγησης ιστού στο οδηγοί/ κατάλογο του έργου. Έχω εξηγήσει τη διαδικασία λήψης και εγκατάστασης προγραμμάτων οδήγησης ιστού στο άρθρο μου Εισαγωγή στο σελήνιο στην Python 3 Το

Αποκτήστε το XPath Selector χρησιμοποιώντας το Chrome Developer Tool:

Σε αυτήν την ενότητα, θα σας δείξω πώς μπορείτε να βρείτε τον επιλογέα XPath του στοιχείου ιστοσελίδας που θέλετε να επιλέξετε με το Selenium χρησιμοποιώντας το ενσωματωμένο Εργαλείο προγραμματιστή του προγράμματος περιήγησης Google Chrome.

Για να αποκτήσετε τον επιλογέα XPath χρησιμοποιώντας το πρόγραμμα περιήγησης Google Chrome, ανοίξτε το Google Chrome και επισκεφτείτε τον ιστότοπο από τον οποίο θέλετε να εξαγάγετε δεδομένα. Στη συνέχεια, πατήστε το δεξί κουμπί του ποντικιού (RMB) σε μια κενή περιοχή της σελίδας και κάντε κλικ στο Επιθεωρώ να ανοίξει το Εργαλείο προγραμματιστή Chrome Το

Μπορείτε επίσης να πατήσετε + Μετατόπιση + Εγώ να ανοίξει το Εργαλείο προγραμματιστή Chrome Το

Εργαλείο προγραμματιστή Chrome πρέπει να ανοίξει.

Για να βρείτε την αναπαράσταση HTML του στοιχείου ιστοσελίδας που θέλετε, κάντε κλικ στο Επιθεωρώ (

), όπως σημειώνεται στο παρακάτω στιγμιότυπο οθόνης.

Στη συνέχεια, τοποθετήστε το δείκτη του ποντικιού πάνω από το στοιχείο της ιστοσελίδας που θέλετε και πατήστε το αριστερό πλήκτρο του ποντικιού (LMB) για να το επιλέξετε.

Η αναπαράσταση HTML του στοιχείου ιστού που έχετε επιλέξει θα επισημανθεί στο Στοιχεία καρτέλα του Chrome Developer Tool, όπως μπορείτε να δείτε στο παρακάτω στιγμιότυπο οθόνης.

Για να λάβετε τον επιλογέα XPath του επιθυμητού στοιχείου, επιλέξτε το στοιχείο από το Στοιχεία καρτέλα του Εργαλείο προγραμματιστή Chrome και κάντε δεξί κλικ (RMB) σε αυτό. Στη συνέχεια, επιλέξτε αντίγραφο >> Αντιγραφή XPath, όπως σημειώνεται στο παρακάτω στιγμιότυπο οθόνης.

Έχω επικολλήσει τον επιλογέα XPath σε έναν επεξεργαστή κειμένου. Ο επιλογέας XPath φαίνεται όπως φαίνεται στο παρακάτω στιγμιότυπο οθόνης.

Αποκτήστε το XPath Selector χρησιμοποιώντας το Firefox Developer Tool:

Σε αυτήν την ενότητα, θα σας δείξω πώς μπορείτε να βρείτε τον επιλογέα XPath του στοιχείου ιστοσελίδας που θέλετε να επιλέξετε με το Selenium χρησιμοποιώντας το ενσωματωμένο Εργαλείο προγραμματιστή του προγράμματος περιήγησης Mozilla Firefox.

Για να αποκτήσετε τον επιλογέα XPath χρησιμοποιώντας το πρόγραμμα περιήγησης ιστού Firefox, ανοίξτε τον Firefox και επισκεφτείτε την ιστοσελίδα από την οποία θέλετε να εξαγάγετε δεδομένα. Στη συνέχεια, πατήστε το δεξί κουμπί του ποντικιού (RMB) σε μια κενή περιοχή της σελίδας και κάντε κλικ στο Επιθεώρηση στοιχείου (Q) να ανοίξει το Εργαλείο προγραμματιστή Firefox Το

Εργαλείο προγραμματιστή Firefox πρέπει να ανοίξει.

Για να βρείτε την αναπαράσταση HTML του στοιχείου ιστοσελίδας που θέλετε, κάντε κλικ στο Επιθεωρώ (

), όπως σημειώνεται στο παρακάτω στιγμιότυπο οθόνης.

Στη συνέχεια, τοποθετήστε το δείκτη του ποντικιού πάνω από το στοιχείο της ιστοσελίδας που θέλετε και πατήστε το αριστερό πλήκτρο του ποντικιού (LMB) για να το επιλέξετε.

Η αναπαράσταση HTML του στοιχείου ιστού που έχετε επιλέξει θα επισημανθεί στο Επιθεωρητής καρτέλα του Εργαλείο προγραμματιστών Firefox, όπως μπορείτε να δείτε στο παρακάτω στιγμιότυπο οθόνης.

Για να λάβετε τον επιλογέα XPath του επιθυμητού στοιχείου, επιλέξτε το στοιχείο από το Επιθεωρητής καρτέλα του Εργαλείο προγραμματιστή Firefox και κάντε δεξί κλικ (RMB) σε αυτό. Στη συνέχεια, επιλέξτε αντίγραφο >> XPath όπως σημειώνεται στο παρακάτω στιγμιότυπο οθόνης.

Ο επιλογέας XPath του επιθυμητού στοιχείου θα πρέπει να μοιάζει με αυτό.

Εξαγωγή δεδομένων από ιστοσελίδες χρησιμοποιώντας XPath Selector:

Σε αυτήν την ενότητα, θα σας δείξω πώς να επιλέξετε στοιχεία ιστοσελίδας και να εξαγάγετε δεδομένα από αυτά χρησιμοποιώντας επιλογείς XPath με τη βιβλιοθήκη Selenium Python.

Αρχικά, δημιουργήστε ένα νέο σενάριο Python ex01.py και πληκτρολογήστε τις ακόλουθες γραμμές κωδικών.

Μόλις τελειώσετε, αποθηκεύστε το ex01.py Python script.

Η γραμμή 1-3 εισάγει όλα τα απαιτούμενα στοιχεία σεληνίου.

Η γραμμή 5 δημιουργεί ένα αντικείμενο Επιλογές Chrome και η γραμμή 6 ενεργοποιεί τη λειτουργία χωρίς κεφαλές για το πρόγραμμα περιήγησης ιστού Chrome.

Η γραμμή 8 δημιουργεί ένα Chrome πρόγραμμα περιήγησης αντικείμενο χρησιμοποιώντας το chromedriver δυαδικό από το οδηγοί/ κατάλογο του έργου.

Η γραμμή 10 λέει στο πρόγραμμα περιήγησης να φορτώσει τον ιστότοπο unixtimestamp.com.

Η γραμμή 12 βρίσκει το στοιχείο που έχει τα δεδομένα χρονικής σήμανσης από τη σελίδα χρησιμοποιώντας τον επιλογέα XPath και το αποθηκεύει στο χρονική σήμανση μεταβλητός.

Η γραμμή 13 αναλύει τα δεδομένα χρονικής σήμανσης από το στοιχείο και τα εκτυπώνει στην κονσόλα.

Έχω αντιγράψει τον επιλογέα XPath του επισημασμένου η2 στοιχείο από unixtimestamp.com χρησιμοποιώντας το Chrome Developer Tool.

Η γραμμή 14 κλείνει το πρόγραμμα περιήγησης.

Εκτελέστε το σενάριο Python ex01.py ως εξής:

Όπως μπορείτε να δείτε, τα δεδομένα χρονικής σήμανσης εκτυπώνονται στην οθόνη.

Εδώ, έχω χρησιμοποιήσει το browser.find_element_by_xpath (επιλογέας) μέθοδος. Η μόνη παράμετρος αυτής της μεθόδου είναι η εκλέκτορας, που είναι ο επιλογέας XPath του στοιχείου.

Αντί browser.find_element_by_xpath () μέθοδο, μπορείτε επίσης να χρησιμοποιήσετε browser.find_element (Από, επιλογέας) μέθοδος. Αυτή η μέθοδος χρειάζεται δύο παραμέτρους. Η πρώτη παράμετρος Με θα είναι By.XPATH όπως θα χρησιμοποιούμε τον επιλογέα XPath και τη δεύτερη παράμετρο εκλέκτορας θα είναι ο ίδιος ο επιλογέας XPath. Το αποτέλεσμα θα είναι το ίδιο.

Για να δούμε πώς browser.find_element () η μέθοδος λειτουργεί για τον επιλογέα XPath, δημιουργήστε ένα νέο σενάριο Python ex02.py , αντιγράψτε και επικολλήστε όλες τις γραμμές από ex01.py προς το ex02.py και αλλαγή γραμμή 12 όπως σημειώνεται στο παρακάτω στιγμιότυπο οθόνης.

Όπως μπορείτε να δείτε, το σενάριο Python ex02.py δίνει το ίδιο αποτέλεσμα με ex01.py Το

ο browser.find_element_by_xpath () και browser.find_element () χρησιμοποιούνται μέθοδοι για την εύρεση και την επιλογή ενός στοιχείου από ιστοσελίδες. Εάν θέλετε να βρείτε και να επιλέξετε πολλά στοιχεία χρησιμοποιώντας επιλογείς XPath, τότε πρέπει να χρησιμοποιήσετε browser.find_elements_by_xpath () ή browser.find_elements () μεθόδους.

ο browser.find_elements_by_xpath () η μέθοδος λαμβάνει το ίδιο επιχείρημα με το browser.find_element_by_xpath () μέθοδος.

ο browser.find_elements () η μέθοδος λαμβάνει τα ίδια επιχειρήματα με το browser.find_element () μέθοδος.

Ας δούμε ένα παράδειγμα εξαγωγής λίστας ονομάτων χρησιμοποιώντας τον επιλογέα XPath από random-name-generator.info με τη βιβλιοθήκη Selenium Python.

Η μη ταξινομημένη λίστα ( καλούπι ετικέτα) έχει 10 στο ετικέτες στο καθένα που περιέχουν ένα τυχαίο όνομα. Το XPath για να επιλέξετε όλα τα στο ετικέτες μέσα στο καλούπι ετικέτα σε αυτή την περίπτωση είναι //*[@id = main]/div [3]/div [2]/ol // li

Ας δούμε ένα παράδειγμα επιλογής πολλαπλών στοιχείων από την ιστοσελίδα χρησιμοποιώντας επιλογείς XPath.

Δημιουργήστε ένα νέο σενάριο Python ex03.py και πληκτρολογήστε τις ακόλουθες γραμμές κωδικών σε αυτό.

Μόλις τελειώσετε, αποθηκεύστε το ex03.py Python script.

Η γραμμή 1-8 είναι η ίδια όπως στο ex01.py Σενάριο Python. Έτσι, δεν πρόκειται να τους εξηγήσω ξανά εδώ.

Η γραμμή 10 λέει στο πρόγραμμα περιήγησης να φορτώσει τον ιστότοπο random-name-generator.info.

Η γραμμή 12 επιλέγει τη λίστα ονομάτων χρησιμοποιώντας το browser.find_elements_by_xpath () μέθοδος. Αυτή η μέθοδος χρησιμοποιεί τον επιλογέα XPath //*[@id = main]/div [3]/div [2]/ol // li για να βρείτε τη λίστα ονομάτων. Στη συνέχεια, η λίστα ονομάτων αποθηκεύεται στο ονόματα μεταβλητός.

Στις γραμμές 13 και 14, α Για ο βρόχος χρησιμοποιείται για να επαναληφθεί μέσω του ονόματα λίστα και εκτύπωση των ονομάτων στην κονσόλα.

Η γραμμή 16 κλείνει το πρόγραμμα περιήγησης.

Εκτελέστε το σενάριο Python ex03.py ως εξής:

Όπως μπορείτε να δείτε, τα ονόματα εξάγονται από την ιστοσελίδα και εκτυπώνονται στην κονσόλα.

Αντί να χρησιμοποιήσετε το browser.find_elements_by_xpath () μέθοδο, μπορείτε επίσης να χρησιμοποιήσετε το browser.find_elements () μέθοδο όπως πριν. Το πρώτο επιχείρημα αυτής της μεθόδου είναι By.XPATH, και το δεύτερο όρισμα είναι ο επιλογέας XPath.

Να πειραματιστείτε με browser.find_elements () μέθοδο, δημιουργήστε ένα νέο σενάριο Python ex04.py , αντιγράψτε όλους τους κωδικούς από ex03.py προς το ex04.py , και αλλάξτε τη γραμμή 12 όπως σημειώνεται στο παρακάτω στιγμιότυπο οθόνης.

Θα πρέπει να έχετε το ίδιο αποτέλεσμα με πριν.

Βασικά στοιχεία του επιλογέα XPath:

Το Εργαλείο προγραμματιστή του Firefox ή του προγράμματος περιήγησης ιστού Google Chrome δημιουργεί αυτόματα τον επιλογέα XPath. Αλλά αυτοί οι επιλογείς XPath μερικές φορές δεν επαρκούν για το έργο σας. Σε αυτήν την περίπτωση, πρέπει να γνωρίζετε τι κάνει ένας συγκεκριμένος επιλογέας XPath για να δημιουργήσει τον επιλογέα XPath. Σε αυτήν την ενότητα, θα σας δείξω τα βασικά των επιλογών XPath. Στη συνέχεια, θα πρέπει να μπορείτε να δημιουργήσετε τον δικό σας επιλογέα XPath.

Δημιουργήστε έναν νέο κατάλογο www/ στον κατάλογο του έργου σας ως εξής:

Δημιουργήστε ένα νέο αρχείο web01.html στο www/ κατάλογο και πληκτρολογήστε τις ακόλουθες γραμμές σε αυτό το αρχείο.

Μόλις τελειώσετε, αποθηκεύστε το web01.html αρχείο.

Εκτελέστε έναν απλό διακομιστή HTTP στη θύρα 8080 χρησιμοποιώντας την ακόλουθη εντολή:

Ο διακομιστής HTTP πρέπει να ξεκινήσει.

Θα πρέπει να έχετε πρόσβαση στο web01.html αρχείο χρησιμοποιώντας τη διεύθυνση URL http: // localhost: 8080/web01.html , όπως μπορείτε να δείτε στο παρακάτω στιγμιότυπο οθόνης.

Ενώ το Firefox ή το Chrome Developer Tool είναι ανοιχτό, πατήστε + φά για να ανοίξετε το πλαίσιο αναζήτησης. Μπορείτε να πληκτρολογήσετε τον επιλογέα XPath εδώ και να δείτε τι επιλέγει πολύ εύκολα. Θα χρησιμοποιήσω αυτό το εργαλείο σε όλη αυτήν την ενότητα.

Ένας επιλογέας XPath ξεκινά με ένα πλάγια κάθετη (/) τον περισσότερο καιρό. Είναι σαν ένα δέντρο καταλόγου Linux. ο / είναι η ρίζα όλων των στοιχείων στην ιστοσελίδα.

Το πρώτο στοιχείο είναι το html Το Έτσι, ο επιλογέας XPath /html επιλέγει ολόκληρο html ετικέτα.

μεσα στην html ετικέτα, έχουμε ένα σώμα ετικέτα. ο σώμα η ετικέτα μπορεί να επιλεγεί με τον επιλογέα XPath /html/body

ο η1 η κεφαλίδα είναι μέσα στο σώμα ετικέτα. ο η1 η κεφαλίδα μπορεί να επιλεγεί με τον επιλογέα XPath /html/body/h1

Αυτός ο τύπος επιλογέα XPath ονομάζεται επιλογέας απόλυτης διαδρομής. Στον απόλυτο επιλογέα διαδρομής, πρέπει να διασχίσετε την ιστοσελίδα από τη ρίζα (/) της σελίδας. Το μειονέκτημα ενός απόλυτου επιλογέα διαδρομής είναι ότι ακόμη και μια μικρή αλλαγή στη δομή της ιστοσελίδας μπορεί να κάνει τον επιλογέα XPath άκυρο. Η λύση σε αυτό το πρόβλημα είναι ένας σχετικός ή μερικός επιλογέας XPath.

Για να δείτε πώς λειτουργεί η σχετική διαδρομή ή η μερική διαδρομή, δημιουργήστε ένα νέο αρχείο web02.html στο www/ κατάλογο και πληκτρολογήστε τις ακόλουθες γραμμές κωδικών σε αυτόν.

Μόλις τελειώσετε, αποθηκεύστε το web02.html αρχείο και φορτώστε το στο πρόγραμμα περιήγησης ιστού.

Όπως μπορείτε να δείτε, ο επιλογέας XPath // div/p επιλέγει το Π ετικέτα μέσα στο div ετικέτα. Αυτό είναι ένα παράδειγμα σχετικού επιλογέα XPath.

Ο σχετικός επιλογέας XPath ξεκινά με // Το Στη συνέχεια, καθορίζετε τη δομή του στοιχείου που θέλετε να επιλέξετε. Σε αυτήν την περίπτωση, div/p Το

Ετσι, // div/p σημαίνει επιλέξτε το Π στοιχείο μέσα σε α div στοιχείο, δεν έχει σημασία τι έρχεται πριν από αυτό.

Μπορείτε επίσης να επιλέξετε στοιχεία με διαφορετικά χαρακτηριστικά, όπως ταυτότητα , τάξη , τύπος, κλπ. χρησιμοποιώντας τον επιλογέα XPath. Ας δούμε πώς να το κάνουμε αυτό.

Δημιουργήστε ένα νέο αρχείο web03.html στο www/ κατάλογο και πληκτρολογήστε τις ακόλουθες γραμμές κωδικών σε αυτόν.

Μόλις τελειώσετε, αποθηκεύστε το web03.html αρχείο και φορτώστε το στο πρόγραμμα περιήγησης ιστού.

Ας υποθέσουμε ότι θέλετε να επιλέξετε όλα τα div στοιχεία που έχουν το τάξη όνομα δοχείο 1 Το Για να το κάνετε αυτό, μπορείτε να χρησιμοποιήσετε τον επιλογέα XPath // div [@class = ’container1 ′]

Όπως μπορείτε να δείτε, έχω 2 στοιχεία που ταιριάζουν με τον επιλογέα XPath // div [@class = ’container1 ′]

Για να επιλέξετε το πρώτο div στοιχείο με το τάξη όνομα δοχείο 1 , Προσθήκη [1] στο τέλος του XPath επιλέξτε, όπως φαίνεται στο παρακάτω στιγμιότυπο οθόνης.

Με τον ίδιο τρόπο, μπορείτε να επιλέξετε το δεύτερο div στοιχείο με το τάξη όνομα δοχείο 1 χρησιμοποιώντας τον επιλογέα XPath // div [@class = ’container1 ′] [2]

Μπορείτε να επιλέξετε στοιχεία κατά ταυτότητα επισης.

Για παράδειγμα, για να επιλέξετε το στοιχείο που έχει το ταυτότητα του footer-msg , μπορείτε να χρησιμοποιήσετε τον επιλογέα XPath //*[@id = ’footer-msg’]

Εδώ, το * πριν [@id = ’footer-msg’] χρησιμοποιείται για την επιλογή οποιουδήποτε στοιχείου ανεξάρτητα από την ετικέτα του.

Αυτά είναι τα βασικά του επιλογέα XPath. Τώρα, θα πρέπει να μπορείτε να δημιουργήσετε τον δικό σας επιλογέα XPath για τα έργα Selenium.

Συμπέρασμα:

Σε αυτό το άρθρο, σας έχω δείξει πώς μπορείτε να βρείτε και να επιλέξετε στοιχεία από ιστοσελίδες χρησιμοποιώντας τον επιλογέα XPath με τη βιβλιοθήκη Selenium Python. Συζήτησα επίσης για τους πιο συνηθισμένους επιλογείς XPath. Αφού διαβάσετε αυτό το άρθρο, θα πρέπει να αισθάνεστε αρκετά σίγουροι ότι επιλέγετε στοιχεία από ιστοσελίδες χρησιμοποιώντας τον επιλογέα XPath με τη βιβλιοθήκη Selenium Python.