Πώς να χειριστείτε τον πίνακα Ιστού Selenium Πρόγραμμα οδήγησης Web

Σε τι είναι ένας πίνακας Ιστού Selenium?

A Πίνακας Ιστού in Selenium είναι ένα στοιχείο Web που χρησιμοποιείται για την αναπαράσταση σε πίνακα δεδομένων ή πληροφοριών. Τα δεδομένα ή οι πληροφορίες εμφανίζονταιyed μπορεί να είναι είτε στατική είτε δυναμική. Ο πίνακας Ιστού και τα στοιχεία του μπορούν να προσπελαστούν χρησιμοποιώντας συναρτήσεις και εντοπιστές WebElement Selenium. Ένα τυπικό παράδειγμα ενός πίνακα ιστού θα ήταν η ένδειξη προδιαγραφών προϊόντοςyed σε μια πλατφόρμα ηλεκτρονικού εμπορίου.

Ανάγνωση ενός Πίνακα Ιστού HTML

Υπάρχουν φορές που χρειάζεται να αποκτήσουμε πρόσβαση σε στοιχεία (συνήθως κείμενα) που βρίσκονται μέσα σε πίνακες HTML. Ωστόσο, είναι πολύ σπάνιο για έναν σχεδιαστή Ιστού να παρέχει ένα χαρακτηριστικό αναγνωριστικού ή ονόματος σε ένα συγκεκριμένο κελί στον πίνακα. Επομένως, δεν μπορούμε να χρησιμοποιήσουμε τις συνήθεις μεθόδους όπως "By.id()", "By.name()" ή "By.cssSelector()". Σε αυτήν την περίπτωση, η πιο αξιόπιστη επιλογή είναι η πρόσβαση σε αυτά χρησιμοποιώντας τη μέθοδο "By.xpath()".

Πώς να χειριστείτε τον πίνακα Ιστού Selenium

Εξετάστε τον παρακάτω κώδικα HTML για τη διαχείριση πινάκων ιστού Selenium.

Πώς να γράψετε το XPath για πίνακα Selenium

Θα το χρησιμοποιησουμε XPath για να λάβετε το εσωτερικό κείμενο του κελιού που περιέχει το κείμενο "τέταρτο κελί".

Πώς να γράψετε το XPath για πίνακα Selenium

Βήμα 1 – Ορισμός του γονικού στοιχείου (πίνακας)

Οι εντοπιστές XPath στο WebDriver ξεκινούν πάντα με α double κάθετο "//" προς τα εμπρός και στη συνέχεια το γονικό στοιχείο. Δεδομένου ότι έχουμε να κάνουμε με πίνακες ιστού στο Selenium, το γονικό στοιχείο θα πρέπει πάντα να είναι το ετικέτα. Η πρώτη μερίδα μας Selenium Επομένως, ο εντοπιστής πίνακα XPath θα πρέπει να ξεκινά με "//table".

Selenium Παράδειγμα πίνακα Ιστού

Βήμα 2 – Προσθέστε τα θυγατρικά στοιχεία

Το στοιχείο αμέσως κάτω είναι έτσι μπορούμε να το πούμε είναι το «παιδί» του . Και επίσης, είναι ο «γονέας» του . Όλα τα θυγατρικά στοιχεία στο XPath τοποθετούνται στα δεξιά του γονικού τους στοιχείου, χωρισμένα με μία κάθετο προς τα εμπρός «/» όπως ο κώδικας που φαίνεται παρακάτω.

Selenium Παράδειγμα πίνακα Ιστού

Βήμα 3 – Προσθήκη κατηγορημάτων

ο το στοιχείο περιέχει δύο ετικέτες. Μπορούμε τώρα να πούμε ότι αυτά τα δύο Οι ετικέτες είναι "παιδιά" του . Κατά συνέπεια, μπορούμε να πούμε ότι είναι ο γονέας και των δύο στοιχεία.

Κάτι άλλο που μπορούμε να συμπεράνουμε είναι ότι τα δύο στοιχεία είναι αδέρφια. Τα αδέρφια αναφέρονται σε παιδικά στοιχεία που έχουν τον ίδιο γονέα.

Για να φτάσετε στο θέλουμε να έχουμε πρόσβαση (αυτό με το κείμενο "τέταρτο κελί"), πρέπει πρώτα να έχουμε πρόσβαση στο δεύτερος και όχι το πρώτο. Αν απλώς γράψουμε "//table/tbody/tr", τότε θα έχουμε πρόσβαση στο πρώτο ετικέτα.

Λοιπόν, πώς έχουμε πρόσβαση στο δεύτερο έπειτα? Η απάντηση σε αυτό είναι η χρήση Κατηγορήματα.

Κατηγορήματα είναι numbers ή χαρακτηριστικά HTML που περικλείονται σε ένα ζεύγος τετραγώνων brackets "[ ]" που διακρίνει ένα στοιχείο παιδιού από τα αδέρφια του. Δεδομένου ότι το πρέπει να έχουμε πρόσβαση είναι το δεύτερο, θα χρησιμοποιήσουμε το "[2]" ως κατηγόρημα.

Selenium Παράδειγμα πίνακα Ιστού

Εάν δεν χρησιμοποιήσουμε κανένα κατηγορούμενο, το XPath θα έχει πρόσβαση στον πρώτο αδερφό. Επομένως, μπορούμε να έχουμε πρόσβαση στο πρώτο χρησιμοποιώντας έναν από αυτούς τους κωδικούς XPath.

Selenium Πίνακας Ιστού με χρήση Xpath

Βήμα 4 – Προσθέστε τα διαδοχικά θυγατρικά στοιχεία χρησιμοποιώντας τις κατάλληλες κατηγόριες

Το επόμενο στοιχείο στο οποίο πρέπει να έχουμε πρόσβαση είναι το δεύτερο . Εφαρμόζοντας τις αρχές που μάθαμε από τα βήματα 2 και 3, θα οριστικοποιήσουμε τον κώδικα XPath ώστε να είναι όπως αυτός που φαίνεται παρακάτω.

Πίνακας Ιστού σε Selenium χρησιμοποιώντας το Xpath

Τώρα που έχουμε τον σωστό εντοπιστή XPath, μπορούμε ήδη να έχουμε πρόσβαση στο κελί που θέλαμε και να λάβουμε το εσωτερικό του κείμενο χρησιμοποιώντας τον παρακάτω κώδικα. Προϋποθέτει ότι έχετε αποθηκεύσει τον παραπάνω κώδικα HTML ως "newhtml.html" στη μονάδα δίσκου C.

Πίνακας Ιστού σε Selenium χρησιμοποιώντας το Xpath

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/write-xpath-table.html";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(
		By.xpath("//table/tbody/tr[2]/td[2]")).getText(); 	
        System.out.println(innerText); 
	driver.quit();
	}
}

Πίνακας Ιστού σε Selenium χρησιμοποιώντας το Xpath

Πρόσβαση σε ένθετους πίνακες

Οι ίδιες αρχές που συζητήθηκαν παραπάνω ισχύουν για ένθετους πίνακες. Οι ένθετοι πίνακες είναι πίνακες που βρίσκονται μέσα σε έναν άλλο πίνακα. Ένα παράδειγμα φαίνεται παρακάτω.

Τρόπος πρόσβασης σε ένθετους πίνακες Selenium

Για πρόσβαση στο κελί με το κείμενο "4-5-6" χρησιμοποιώντας το "//γονέας/παιδί" και το κατηγόρημα concepts από την προηγούμενη ενότητα, θα πρέπει να μπορούμε να βρούμε τον κώδικα XPath παρακάτω.

Τρόπος πρόσβασης σε ένθετους πίνακες Selenium


Ο παρακάτω κώδικας WebDriver θα πρέπει να μπορεί να ανακτήσει το εσωτερικό κείμενο του κελιού στο οποίο έχουμε πρόσβαση.

Πρόσβαση σε ένθετους πίνακες στο Selenium

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/accessing-nested-table.html";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(
		By.xpath("//table/tbody/tr[2]/td[2]/table/tbody/tr/td[2]")).getText(); 		
        System.out.println(innerText); 
	driver.quit();
}

Η παρακάτω έξοδος επιβεβαιώνει ότι έγινε επιτυχής πρόσβαση στον εσωτερικό πίνακα.

Πρόσβαση σε ένθετους πίνακες στο Selenium

Χρήση Ιδιοτήτων ως Κατηγορήματα

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

Στο παρακάτω παράδειγμα, το κελί "New York to Chicago" βρίσκεται βαθιά στον κώδικα HTML της αρχικής σελίδας Mercury Tours.

Selenium Παράδειγμα πίνακα Ιστού με χρήση των Χαρακτηριστικών ως Κατηγορημάτων

Selenium Παράδειγμα πίνακα Ιστού με χρήση των Χαρακτηριστικών ως Κατηγορημάτων

Σε αυτήν την περίπτωση, μπορούμε να χρησιμοποιήσουμε το μοναδικό χαρακτηριστικό του πίνακα (width=”270″) ως κατηγόρημα. Τα χαρακτηριστικά χρησιμοποιούνται ως κατηγόρημα προσθέτοντάς τα με το σύμβολο @. Στο παραπάνω παράδειγμα, το κελί "New York to Chicago" βρίσκεται στο πρώτο του τέταρτου , και έτσι το XPath μας θα πρέπει να είναι όπως φαίνεται παρακάτω.

Selenium Παράδειγμα πίνακα Ιστού με Χαρακτηριστικά ως Κατηγορήματα

Να θυμάστε ότι όταν βάζουμε τον κώδικα XPath στην Java, θα πρέπει να χρησιμοποιούμε τον χαρακτήρα διαφυγής προς τα πίσω κάθετο "\" για το double εισαγωγικά και στις δύο πλευρές του "270", έτσι ώστε το όρισμα συμβολοσειράς της By.xpath() να μην τερματίζεται πρόωρα.

Selenium Παράδειγμα πίνακα Ιστού με Χαρακτηριστικά ως Κατηγορήματα

Τώρα είμαστε έτοιμοι να αποκτήσουμε πρόσβαση σε αυτό το κελί χρησιμοποιώντας τον παρακάτω κώδικα.

Selenium Παράδειγμα πίνακα Ιστού με Χαρακτηριστικά ως Κατηγορήματα

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/newtours/";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(By
		.xpath("//table[@width=\"270\"]/tbody/tr[4]/td"))
		.getText(); 		
	System.out.println(innerText); 
	driver.quit();
}

Selenium Παράδειγμα πίνακα Ιστού με Χαρακτηριστικά ως Κατηγορήματα

Συντόμευση: Χρησιμοποιήστε το στοιχείο Inspect Element για πρόσβαση σε πίνακες Selenium

Εάν ο αριθμός ή το χαρακτηριστικό ενός στοιχείου είναι εξαιρετικά δύσκολο ή αδύνατο να αποκτηθεί, ο πιο γρήγορος τρόπος για να δημιουργήσετε τον κώδικα XPath είναι να χρησιμοποιήσετε το στοιχείο Inspect Element.

Εξετάστε το παρακάτω παράδειγμα από την αρχική σελίδα του Mercury Tours.

Selenium Παράδειγμα πίνακα Ιστού με Χαρακτηριστικά ως Κατηγορήματα

Βήμα 1

Χρησιμοποιήστε το Firebug για να αποκτήσετε τον κωδικό XPath.

Selenium Παράδειγμα πίνακα Ιστού με Χαρακτηριστικά ως Κατηγορήματα

Βήμα 2

Αναζητήστε το πρώτο γονικό στοιχείο "πίνακας" και διαγράψτε τα πάντα στα αριστερά του.

Selenium Παράδειγμα πίνακα Ιστού με Χαρακτηριστικά ως Κατηγορήματα

Βήμα 3

Προσθέστε πρόθεμα στο υπόλοιπο τμήμα του κώδικα με double κάθετο "//" προς τα εμπρός και αντιγράψτε το στον κώδικα WebDriver σας.

Selenium Παράδειγμα πίνακα ιστού με χαρακτηριστικά

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

Selenium Παράδειγμα πίνακα ιστού με χαρακτηριστικά

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/newtours/";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(By
		.xpath("//table/tbody/tr/td[2]"
		+ "//table/tbody/tr[4]/td/"
		+ "table/tbody/tr/td[2]/"
		+ "table/tbody/tr[2]/td[1]/"
		+ "table[2]/tbody/tr[3]/td[2]/font"))
		.getText(); 		
	System.out.println(innerText); 
	driver.quit();
}

Χαρακτηριστικά

  • Η By.xpath() χρησιμοποιείται συνήθως για πρόσβαση σε στοιχεία του WebTable Selenium.
  • Εάν το στοιχείο είναι γραμμένο βαθιά μέσα στον κώδικα HTML έτσι ώστε ο αριθμός που θα χρησιμοποιηθεί για το κατηγόρημα είναι πολύ δύσκολο να προσδιοριστεί, μπορούμε να χρησιμοποιήσουμε το μοναδικό χαρακτηριστικό αυτού του στοιχείου για Selenium λήψη στοιχείου πίνακα.
  • Τα χαρακτηριστικά χρησιμοποιούνται ως κατηγόρημα προσθέτοντάς τα με το σύμβολο @.
  • Χρησιμοποιήστε το Inspect Element για πρόσβαση στο WebTable Selenium