שימוש ב- XPath ובסלניום לאיתור אלמנט בדף HTML

Using Xpath Selenium Find An Element Html Page



XPath, המכונה גם שפת נתיבי XML, היא שפה לבחירת רכיבים ממסמך XML. מכיוון ש- HTML ו- XML ​​עוקבים אחר אותו מבנה מסמכים, ניתן להשתמש ב- XPath גם לבחירת רכיבים מדף אינטרנט.

איתור ובחירת אלמנטים מדף האינטרנט הוא המפתח לגרידת אתרים באמצעות סלניום. לאיתור ובחירת אלמנטים מדף האינטרנט, תוכל להשתמש בבוררי XPath בסלניום.







במאמר זה, אני הולך להראות לך כיצד לאתר ולבחור אלמנטים מדפי אינטרנט באמצעות בוחרי XPath בסלניום בעזרת ספריית פייתון סלניום. אז בואו נתחיל.



דרישות מוקדמות:

כדי לנסות את הפקודות והדוגמאות של מאמר זה, עליך להיות בעל,



  1. הפצת לינוקס (רצוי אובונטו) המותקנת במחשב שלך.
  2. Python 3 מותקן במחשב שלך.
  3. PIP 3 מותקן במחשב שלך.
  4. פִּיתוֹן וירטואלי החבילה המותקנת במחשב שלך.
  5. דפדפני אינטרנט של Mozilla Firefox או Google Chrome המותקנים במחשב שלך.
  6. חייב לדעת כיצד להתקין את מנהל ההתקן Gecko של Firefox או את מנהל ההתקן של Chrome.

לעמידה בדרישות 4, 5 ו -6, קרא את המאמר שלי מבוא לסלניום בפייתון 3 . אתה יכול למצוא מאמרים רבים בנושאים אחרים בנושא LinuxHint.com . הקפד לבדוק אותם אם אתה זקוק לעזרה כלשהי.





הגדרת מדריך פרויקטים:

כדי לשמור על הכל מאורגן, צור ספריית פרוייקטים חדשה סלניום-קספאט/ כדלהלן:

$mkdir -pvסלניום- xpath/נהגים



נווט אל סלניום-קספאט/ ספריית הפרויקטים כדלקמן:

$CDסלניום- xpath/

צור סביבה וירטואלית של פייתון בספריית הפרויקטים כדלקמן:

$virtualenv .venv

הפעל את הסביבה הווירטואלית כדלקמן:

$מָקוֹר.venv/אני/לְהַפְעִיל

התקן את ספריית Selenium Python באמצעות PIP3 כדלקמן:

$ pip3 להתקין סלניום

הורד והתקן את כל מנהל ההתקן הנדרש ב- נהגים/ מדריך הפרויקט. הסברתי את תהליך ההורדה וההתקנה של מנהלי התקני אינטרנט במאמר שלי מבוא לסלניום בפייתון 3 .

קבל את בורר XPath באמצעות כלי המפתחים של Chrome:

בחלק זה, אני הולך להראות לך כיצד למצוא את בורר XPath של רכיב דף האינטרנט שברצונך לבחור עם סלניום באמצעות כלי המפתחים המובנה של דפדפן האינטרנט של Google Chrome.

כדי לקבל את בורר XPath באמצעות דפדפן האינטרנט של Google Chrome, פתח את Google Chrome ובקר באתר האינטרנט שממנו ברצונך לחלץ נתונים. לאחר מכן, לחץ על לחצן העכבר הימני (RMB) על שטח ריק של הדף ולחץ על לִבדוֹק כדי לפתוח את כלי המפתחים של Chrome .

אתה יכול גם ללחוץ + מִשׁמֶרֶת + אני כדי לפתוח את כלי המפתחים של Chrome .

כלי המפתחים של Chrome צריך להיפתח.

כדי למצוא את ייצוג ה- HTML של רכיב דף האינטרנט הרצוי, לחץ על לִבדוֹק (

) סמל, כפי שמסומן בצילום המסך למטה.

לאחר מכן, העבר את העכבר מעל רכיב דף האינטרנט הרצוי ולחץ על לחצן העכבר השמאלי (LMB) כדי לבחור אותו.

ייצוג ה- HTML של רכיב האינטרנט שבחרת יסומן ב- אלמנטים הכרטיסייה של כלי המפתחים של Chrome, כפי שאתה יכול לראות בצילום המסך למטה.

כדי לקבל את בורר XPath של האלמנט הרצוי, בחר את הרכיב מתוך אלמנטים כרטיסייה של כלי המפתחים של Chrome ולחץ עליו באמצעות לחצן העכבר הימני (RMB). לאחר מכן, בחר עותק > העתק XPath, כפי שמסומן בצילום המסך למטה.

הדבקתי את בורר XPath בעורך טקסט. בורר XPath נראה כפי שמוצג בצילום המסך למטה.

קבל את בורר XPath באמצעות כלי המפתחים של Firefox:

בחלק זה, אני הולך להראות לך כיצד למצוא את בורר XPath של רכיב דף האינטרנט שברצונך לבחור עם סלניום באמצעות כלי המפתחים המובנה של דפדפן האינטרנט Mozilla Firefox.

כדי לקבל את בורר XPath באמצעות דפדפן האינטרנט פיירפוקס, פתח את Firefox ובקר באתר האינטרנט ממנו ברצונך לחלץ נתונים. לאחר מכן, לחץ על לחצן העכבר הימני (RMB) על שטח ריק של הדף ולחץ על בדוק את האלמנט (Q) כדי לפתוח את כלי המפתחים של Firefox .

כלי המפתחים של Firefox צריך להיפתח.

כדי למצוא את ייצוג ה- HTML של רכיב דף האינטרנט הרצוי, לחץ על לִבדוֹק (

) סמל, כפי שמסומן בצילום המסך למטה.

לאחר מכן, העבר את העכבר מעל רכיב דף האינטרנט הרצוי ולחץ על לחצן העכבר השמאלי (LMB) כדי לבחור אותו.

ייצוג ה- HTML של רכיב האינטרנט שבחרת יסומן ב- מְפַקֵחַ כרטיסייה של כלי המפתחים של Firefox, כפי שאתה יכול לראות בצילום המסך למטה.

כדי לקבל את בורר XPath של האלמנט הרצוי, בחר את הרכיב מתוך מְפַקֵחַ כרטיסייה של כלי המפתחים של Firefox ולחץ עליו באמצעות לחצן העכבר הימני (RMB). לאחר מכן, בחר עותק > XPath כפי שמסומן בצילום המסך למטה.

בורר XPath של האלמנט הרצוי צריך להיראות בערך כך.

חילוץ נתונים מדפי אינטרנט באמצעות בורר XPath:

בחלק זה, אני הולך להראות לך כיצד לבחור רכיבי דף אינטרנט ולחלץ מהם נתונים באמצעות בוחרי XPath עם ספריית סלניום פייתון.

ראשית, צור סקריפט פייתון חדש ex01.py והקלד את שורות הקודים הבאות.

מסֵלֶנִיוּםיְבוּאמנהל התקן אינטרנט
מסֵלֶנִיוּם.מנהל התקן אינטרנט.מְשׁוּתָף.מפתחות יְבוּאמפתחות
מסֵלֶנִיוּם.מנהל התקן אינטרנט.מְשׁוּתָף.על ידי יְבוּאעל ידי
אפשרויות=מנהל התקן אינטרנט.ChromeOptions()
אפשרויות.חֲסַר רֹאשׁ = נָכוֹן
דפדפן=מנהל התקן אינטרנט.כרום(_path הפעלה='./drivers/chromedriver',
אפשרויות=אפשרויות)
דפדפן.לקבל('https://www.unixtimestamp.com/')
חותמת זמן=דפדפן.find_element_by_xpath('/html/body/div [1]/div [1]
/div [2]/div [1]/div/div/h3 [2] '
)
הדפס('חותמת זמן נוכחית: %s'%(חותמת זמן.טֶקסט.לְפַצֵל('')[0]))
דפדפן.סגור()

לאחר שתסיים, שמור את ex01.py סקריפט פייתון.

קו 1-3 מייבא את כל רכיבי הסלניום הנדרשים.

שורה 5 יוצרת אובייקט אפשרויות Chrome, ושורה 6 מאפשרת מצב ללא ראש לדפדפן האינטרנט של Chrome.

שורה 8 יוצרת Chrome דפדפן אובייקט באמצעות נהג כרום בינארי מה נהגים/ מדריך הפרויקט.

שורה 10 אומרת לדפדפן לטעון את האתר unixtimestamp.com.

שורה 12 מוצאת את האלמנט המכיל את נתוני חותמת הזמן מהדף באמצעות בורר XPath ומאחסנת אותו ב- חותמת זמן מִשְׁתַנֶה.

שורה 13 מנתחת את נתוני חותמת הזמן מהאלמנט ומדפיסה אותם במסוף.

העתקתי את בורר XPath של המסומן h2 אלמנט מ unixtimestamp.com באמצעות כלי המפתחים של Chrome.

שורה 14 סוגרת את הדפדפן.

הפעל את סקריפט Python ex01.py כדלהלן:

$ python3 ex01.py

כפי שאתה יכול לראות, נתוני חותמת הזמן מודפסים על המסך.

הנה, השתמשתי ב- browser.find_element_by_xpath (בורר) שיטה. הפרמטר היחיד של שיטה זו הוא ה- בוחר, שהוא בורר ה- XPath של האלמנט.

במקום browser.find_element_by_xpath () בשיטה, אתה יכול גם להשתמש browser.find_element (לפי, בורר) שיטה. שיטה זו דורשת שני פרמטרים. הפרמטר הראשון על ידי יהיה מאת.XPATH מכיוון שנשתמש בבורר XPath ובפרמטר השני בוחר יהיה בורר ה- XPath עצמו. התוצאה תהיה זהה.

כדי לראות איך browser.find_element () שיטה עובדת עבור בורר XPath, צור סקריפט פייתון חדש ex02.py , העתק והדבק את כל השורות מ ex01.py ל ex02.py ולשנות שורה 12 כפי שמסומן בצילום המסך למטה.

כפי שאתה יכול לראות, סקריפט Python ex02.py נותן את אותה התוצאה כמו ex01.py .

$ python3 ex02.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 עם ספריית Python סלניום.

הרשימה הלא מסודרת ( לָמוּת tag) יש 10 ב תגים בתוך כל אחד המכילים שם אקראי. XPath לבחירת כל ב תגים בתוך לָמוּת תג במקרה זה הוא //*[@id = main]/div [3]/div [2]/ol // li

נעבור על דוגמא לבחירת מרכיבים מרובים מדף האינטרנט באמצעות בוחרי XPath.

צור סקריפט Python חדש ex03.py והקלד בו את שורות הקודים הבאות.

מסֵלֶנִיוּםיְבוּאמנהל התקן אינטרנט
מסֵלֶנִיוּם.מנהל התקן אינטרנט.מְשׁוּתָף.מפתחות יְבוּאמפתחות
מסֵלֶנִיוּם.מנהל התקן אינטרנט.מְשׁוּתָף.על ידי יְבוּאעל ידי
אפשרויות=מנהל התקן אינטרנט.ChromeOptions()
אפשרויות.חֲסַר רֹאשׁ = נָכוֹן
דפדפן=מנהל התקן אינטרנט.כרום(_path הפעלה='./drivers/chromedriver',
אפשרויות=אפשרויות)
דפדפן.לקבל('http://random-name-generator.info/')
שמות=דפדפן.find_elements_by_xpath('
//*[@id = 'main']/div [3]/div [2]/ol // li '
)
לשֵׁםבשמות:
הדפס(שֵׁם.טֶקסט)
דפדפן.סגור()

לאחר שתסיים, שמור את ex03.py סקריפט פייתון.

שורה 1-8 זהה ל- ex01.py סקריפט פייתון. לכן, אני לא מתכוון להסביר אותם כאן שוב.

שורה 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 כדלהלן:

$ python3 ex03.py

כפי שאתה יכול לראות, השמות מופקים מדף האינטרנט ומודפסים על הקונסולה.

במקום להשתמש ב- browser.find_elements_by_xpath () בשיטה, אתה יכול גם להשתמש ב browser.find_elements () שיטה כמו בעבר. הטענה הראשונה של שיטה זו היא מאת .XPATH, והטענה השנייה היא בורר XPath.

להתנסות איתו browser.find_elements () שיטה, צור סקריפט פייתון חדש ex04.py , העתק את כל הקודים מ ex03.py ל ex04.py , ושנה את שורה 12 כפי שמסומן בצילום המסך למטה.

אתה אמור לקבל את אותה התוצאה כמו קודם.

$ python3 ex04.py

יסודות בורר XPath:

כלי המפתחים של Firefox או דפדפן האינטרנט של Google Chrome אכן יוצר בורר XPath באופן אוטומטי. אך לפעמים אלה בוחרי XPath אינם מספיקים לפרויקט שלך. במקרה זה, עליך לדעת מה בורר XPath מסוים עושה כדי לבנות את בורר ה- XPath שלך. בחלק זה, אני הולך להראות לך את היסודות של בוחרי XPath. לאחר מכן, אתה אמור להיות מסוגל לבנות בורר XPath משלך.

צור ספרייה חדשה www/ בספריית הפרויקטים שלך כדלקמן:

$mkdir -vwww

צור קובץ חדש web01.html בתוך ה www/ ספרייה והקלד את השורות הבאות בקובץ זה.


< html lang='עַל'>
< רֹאשׁ >
< meta ערכת תווים='UTF-8'>
< meta שֵׁם='נוף נוף' תוֹכֶן='width = device-width, scale-initial = 1.0'>
< כותרת >מסמך HTML בסיסי</ כותרת >
</ רֹאשׁ >
< גוּף >
< h1 >שלום עולם</ h1 >
</ גוּף >
</ html >

לאחר שתסיים, שמור את web01.html קוֹבֶץ.

הפעל שרת HTTP פשוט ביציאה 8080 באמצעות הפקודה הבאה:

$ python3 -m http.שרת-מדריך www/8080

שרת HTTP צריך להתחיל.

אתה אמור להיות מסוגל לגשת ל web01.html קובץ באמצעות כתובת האתר http: // localhost: 8080/web01.html , כפי שאתה יכול לראות בצילום המסך למטה.

כאשר כלי המפתחים של Firefox או Chrome פתוח, לחץ על + ו כדי לפתוח את תיבת החיפוש. אתה יכול להקליד את בורר XPath שלך כאן ולראות מה הוא בוחר בקלות רבה. אני הולך להשתמש בכלי זה לאורך כל סעיף זה.

בורר XPath מתחיל בא קו נטוי (/) רוב הזמן. זה כמו עץ ​​מדריכי לינוקס. ה / הוא השורש של כל האלמנטים בדף האינטרנט.

המרכיב הראשון הוא ה html . אז בורר XPath /html בוחר את כולו html תָג.

בתוך ה html תג, יש לנו גוּף תָג. ה גוּף ניתן לבחור את התג באמצעות בורר XPath /html/body

ה h1 הכותרת נמצאת בתוך גוּף תָג. ה h1 ניתן לבחור את הכותרת באמצעות בורר XPath /html/body/h1

סוג זה של בורר XPath נקרא בורר נתיבים מוחלט. בבורר הנתיבים המוחלט, עליך לעבור את דף האינטרנט מהשורש (/) של הדף. החיסרון של בורר נתיבים מוחלט הוא שאפילו שינוי קל במבנה דפי האינטרנט עלול להפוך את בורר ה- XPath שלך לתקף. הפתרון לבעיה זו הוא בורר XPath יחסי או חלקי.

כדי לראות כיצד פועל נתיב יחסי או נתיב חלקי, צור קובץ חדש web02.html בתוך ה www/ ספרייה והקלד את שורות הקודים שלהלן.


< html lang='עַל'>
< רֹאשׁ >
< meta ערכת תווים='UTF-8'>
< meta שֵׁם='נוף נוף' תוֹכֶן='width = device-width, scale-initial = 1.0'>
< כותרת >מסמך HTML בסיסי</ כותרת >
</ רֹאשׁ >
< גוּף >
< h1 >שלום עולם</ h1 >

< div >
< עמ >זה מסר</ עמ >
</ div >

< div >
< לְהַקִיף >שלום עולם</ לְהַקִיף >
</ div >
</ גוּף >
</ html >

לאחר שתסיים, שמור את web02.html קובץ וטען אותו בדפדפן האינטרנט שלך.

כפי שאתה יכול לראות, בורר XPath // div/p בוחר את עמ תג בתוך div תָג. זוהי דוגמה לבורר XPath יחסי.

בורר XPath היחסי מתחיל ב- // . לאחר מכן תציין את מבנה האלמנט שברצונך לבחור. במקרה הזה, div/p .

לכן, // div/p פירושו לבחור את עמ אלמנט בתוך א div אלמנט, לא משנה מה בא לפניו.

אתה יכול גם לבחור רכיבים לפי תכונות שונות כמו תְעוּדַת זֶהוּת , מעמד , סוּג, וכו 'באמצעות בורר XPath. בואו נראה כיצד לעשות זאת.

צור קובץ חדש web03.html בתוך ה www/ ספרייה והקלד את שורות הקודים שלהלן.


< html lang='עַל'>
< רֹאשׁ >
< meta ערכת תווים='UTF-8'>
< meta שֵׁם='נוף נוף' תוֹכֶן='width = device-width, scale-initial = 1.0'>
< כותרת > מסמך HTML בסיסי</ כותרת >
</ רֹאשׁ >
< גוּף >
< h1 > שלום עולם</ h1 >
< div מעמד='מיכל 1'>
< עמ > זה מסר</ עמ >
< לְהַקִיף > זו הודעה נוספת</ לְהַקִיף >
</ div >
< div מעמד='מיכל 1'>
< h2 > כותרת2</ h2 >
< עמ > אנשים מסויימים
נבון לבחור את הכאבים, הצרות ואלו שאינם נופלים על הנבחר
טיסות לא פשוטות ושירותים מעולים אחרים? מאיפה ומאיפה הוא נולד?</ עמ >
</ div >

< לְהַקִיף תְעוּדַת זֶהוּת='כותרת תחתונה'> זהו כותרת תחתונה</ לְהַקִיף >
</כותרת תחתונה>
</ גוּף >
</ html >

לאחר שתסיים, שמור את web03.html קובץ וטען אותו בדפדפן האינטרנט שלך.

נניח שאתה רוצה לבחור את כל div אלמנטים שיש בהם מעמד שֵׁם מיכל 1 . לשם כך, תוכל להשתמש בבורר XPath // div [@class = ’container1 ′]

כפי שאתה יכול לראות, יש לי 2 אלמנטים התואמים את בורר XPath // div [@class = ’container1 ′]

כדי לבחור את הראשון div אלמנט עם מעמד שֵׁם מיכל 1 , הוסף [1] בסוף בחירת XPath, כפי שמוצג בצילום המסך למטה.

באותו אופן, אתה יכול לבחור את השני div אלמנט עם מעמד שֵׁם מיכל 1 באמצעות בורר XPath // div [@class = ’container1 ′] [2]

אתה יכול לבחור אלמנטים לפי תְעוּדַת זֶהוּת גם כן.

לדוגמה, כדי לבחור את האלמנט בעל ה- תְעוּדַת זֶהוּת שֶׁל כותרת תחתונה , אתה יכול להשתמש בבורר XPath //*[@id = 'footer-msg']

הנה ה * לפני [@id = 'footer-msg'] משמש לבחירת כל אלמנט ללא קשר לתג שלו.

זה היסודות של בורר XPath. כעת, אתה אמור להיות מסוגל ליצור בורר XPath משלך לפרויקטים של סלניום.

סיכום:

במאמר זה, הראתי לך כיצד למצוא ולבחור אלמנטים מדפי אינטרנט באמצעות בורר XPath עם ספריית סלניום פייתון. דנתי גם בבוררי XPath הנפוצים ביותר. לאחר קריאת מאמר זה, אתה צריך להרגיש די בטוח בבחירת רכיבים מדפי אינטרנט באמצעות בורר XPath עם ספריית סלניום פייתון.