English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
اليوم سأشارككم كيفية تحديد العناصر في selenium بناءً على العناصر الأم والشقيق والجار، يواجه الكثير من الناس في التطبيق العملي مشكلة عدم القدرة على تحديد العنصر المطلوب مباشرة، بل يجب تحديده من خلال العناصر القريبة، ولكن تحديد العنصر من العنصر الأم إلى العنصر الابن، وتحديد العنصر من العنصر الابن إلى العنصر الأم، أو تحديد العنصر الشقيق للعنصر، هو أمر صعب، لا تقلقوا، سأوضح لكم خطوة بخطوة.
1. تحديد العنصر الأب للعثور على العنصر الابن
بالتأكيد الأسهل هو تحديد العنصر الأب للعثور على العنصر الابن، لدينا العديد من الطرق للتحديد، لنرى مثالاً سابقاً:
بالنسبة للكود التالي:
<html> <body> <div id="A"> <!-- تحديد العنصر الأب للعثور على العنصر الابن --> <div id="B"> <div>من الأب إلى الابن</div> </div> </div> </body> </html>
للعثور على العنصر الابن بدون id بناءً على العنصر B، يمكن عرض الكود كما يلي:
# -*- coding: utf-8 -*-
من الصادق selenium import webdriver
driver = webdriver.Firefox()
driver.get('D:\\py\\AutoTestFramework\\src\\others\\test.html')
# 1 البحث المتسلسل
الطبع print driver.find_element_by_id('B').find_element_by_tag_name('div').text
# 2 محدد xpath علاقة الأب والابن
الطبع driver.find_element_by_xpath("//div[@id='B']/div").text
# 3 محدد css علاقة الأب والابن
الطبع driver.find_element_by_css_selector('div#B>div').text
# 4 محدد css nth-child
الطبع driver.find_element_by_css_selector('div#B div:nth-child(1)').text
# 5 محدد css nth-of-type
الطبع driver.find_element_by_css_selector('div#B div:nth-of-type(1)').text
# 6 محور xpath child
الطبع driver.find_element_by_xpath("//div[@id='B']/child::div").text
driver.quit()
النتيجة:
من الأب إلى الابن
من الأب إلى الابن
من الأب إلى الابن
من الأب إلى الابن
من الأب إلى الابن
من الأب إلى الابن
الأساليب من 1 إلى 3 مألوفة لنا، لذا لن نذكرها مرة أخرى. الأسلوب الرابع يستخدم محدد css: nth-child(n)، والذي يعود إلى العنصر رقم n، وهو علامة div؛ الأسلوب الخامس يستخدم محدد css آخر: nth-of-type(n)، والذي يعود إلى علامة div رقم n، يرجى ملاحظة الاختلاف مع المحدد السابق؛ الأسلوب السادس يستخدم محور xpath child، وهو المحور الافتراضي لxpath، يمكن تجاهله، لأنه أساسي هو نفس الأسلوب 2.
当然，css中还有一些选择器是可以选择父子关系的如last-child、nth-last-child等，感兴趣可以自行百度，有机会博主会讲讲css selector。
2. 由子节点定位父节点
由子节点想要定位到父节点就有点难度了，对以下代码：
<html> <body> <div id="A"> <!--子节点定位父节点--> <div> <div>child to parent <div> <div id="C"></div> </div> </div> </div> </div> </body> </html>
我们想要由 C节点 定位其两层父节点的div，示例代码如下：
# -*- coding: utf-8 -*-
من الصادق selenium import webdriver
driver = webdriver.Firefox()
driver.get('D:\\py\\AutoTestFramework\\src\\others\\test.html')
# 1.xpath: `.`代表当前节点; '..'代表父节点
print driver.find_element_by_xpath("//div[@id='C']/../..").text
# 2.xpath轴 parent
print driver.find_element_by_xpath("//div[@id='C']/parent::*/parent::div").text
driver.quit()
النتيجة:
child to parent
child to parent
这里我们有两种办法，第1种是 .. 的形式，就像我们知道的，. 表示当前节点，.. 表示父节点；第2种办法跟上面一样，是xpath轴中的一个：parent，取当前节点的父节点。这里也是css selector的一个痛点，因为css的设计不允许有能够获取父节点的办法（至少目前没有）
3. 由弟弟节点定位哥哥节点
这是第3、第4种情况，我们这里要定位的是兄弟节点了。如以下源码：
<html> <body> <div id="A"> <!--下面两个节点用于兄弟节点定位--> <div>brother 1</div> <div id="D"></div> <div>brother 2</div> </div> </body> </html>
怎么通过 D节点 定位其哥哥节点呢？看代码示例：
# -*- coding: utf-8 -*-
من الصادق selenium import webdriver
driver = webdriver.Firefox()
driver.get('D:\\Code\\py\\AutoTestFramework\\src\\others\\test.html')
# 1.xpath,通过父节点获取其哥哥节点
print driver.find_element_by_xpath("//div[@id='D']/../div[1]").text
# 2.xpath轴 preceding-sibling
إدراج driver.find_element_by_xpath("//div[@id='D']/preceding-sibling::div[1]").text
driver.quit()
نتيجة
brother 1
brother 1
في هذا المقال أيضًا، قدم الباحثان طريقتين، الأولى هي الحصول على الأخ أبناء العنصر من خلال العنصر الأم، والثانية هي أكثر جمالًا، وهي استخدام xpath轴: preceding-sibling، يمكن لهذا الاتجاه الحصول على جميع الأخوة المستويات السابقة للعنصر الحالي، يرجى ملاحظة الرقم في الأقواس، 1 يعني الأخ أبناء الأقرب للعنصر الحالي، وكلما زاد الرقم، كان الأخ أبناء أكثر بُعدًا عن العنصر الحالي، بالطبع، يمكنك أيضًا استخدام xpath轴: preceding، ولكن يبدو أنه أكثر تعقيدًا، حيث يأخذ جميع العناصر غير الأجداد قبل العنصر الحالي (هذا ليس سهلًا للتوضيح، سأكتب مدونة خاصة بكل الاتجاهات في الأيام القادمة)
4. تحديد الأخ أبناء العنصر الإخوة
مصدر الكود مع 3 متطابق، إذا كنت ترغب في تحديد الأخ أبناء العنصر D، راجع مثال الكود:
# -*- coding: utf-8 -*-
من الصادق selenium import webdriver
driver = webdriver.Firefox()
driver.get('D:\\Code\\py\\AutoTestFramework\\src\\others\\test.html')
# 1.xpath،通过父节点获取其弟弟节点
إدراج driver.find_element_by_xpath("//div[@id='D']/../div[3]").text
# 2.xpath轴 following-sibling
إدراج driver.find_element_by_xpath("//div[@id='D']/following-sibling::div[1]").text
# 3.xpath轴 following
إدراج driver.find_element_by_xpath("//div[@id='D']/following::*").text
# 4.css selector +
إدراج driver.find_element_by_css_selector('div#D + div').text
# 5.css selector ~
إدراج driver.find_element_by_css_selector('div#D ~ div').text
driver.quit()
النتيجة:
brother 2
brother 2
brother 2
brother 2
brother 2
شارك المبتدئ خمس طرق للعثور على نود أخيه، الثلاثة الأولى هي باستخدام xpath، الأولى بسيطة جداً لفهمها، الثانية تستخدم xpath axis: following-sibling، وهي مشابهة لـ preceding-sibling، ووظيفتها هي الحصول على جميع النود الأخيرة على نفس المستوى للنود الحالية، وبالنسبة للرقم 1، فإنه يمثل النود الأخيرة الأقرب للنود الحالية، وكلما زاد الرقم، زاد بعد النود الحالية؛ الثالثة تستخدم xpath axis: following، للحصول على جميع النود بعد النود الحالية، باستثناء النود الأصلية (مثل preceding، لكن بسبب سهولة القراءة من الأسفل إلى الأعلى، فإنه يمكن استخدامه أيضًا لتحديد النود الأخيرة، لكن لا يُنصح باستخدامه بهذه الطريقة)；الرابع والخامس، نستخدم css selector، الفرق بين + و ~ هو: + يمثل النود div التي تتبع النود الحالية، و ~ يمثل النود div التي تتبع النود الحالية، إذا استخدمت find_elements، يمكنك الحصول على مجموعة من النود div.
هذا هو الشرح الكامل الذي قدمه المحرر للتعريف بطرق التوضيح لـ Python selenium بين الأبناء والشقيقين والنود المتجاورة، آمل أن يكون هذا مفيدًا لكم، إذا كان لديكم أي أسئلة، فلا تترددوا في ترك تعليق، وسأقوم بالرد على أسئلتكم في أقرب وقت، وأشكركم أيضًا على دعمكم لموقع呐喊 لتعليم البرمجة!
البيان: محتويات هذا المقال تم جمعها من الإنترنت، حقوق الطبع والتأليف مملوكة للمالك الأصلي، يتم جمع المحتوى من قبل المستخدمين عبر الإنترنت بشكل تلقائي، هذا الموقع لا يمتلك حقوق الملكية، لم يتم تعديل المحتوى بشكل يدوي، ولا يتحمل أي مسؤولية قانونية. إذا وجدتم محتوى يشتبه في مخالفة حقوق الطبع والتأليف، يرجى إرسال بريد إلكتروني إلى: notice#oldtoolbag.com (عند إرسال البريد الإلكتروني، يرجى استبدال # بـ @) للإبلاغ، وتقديم الأدلة ذات الصلة، إذا تم التحقق من صحة المعلومات، سيتم حذف المحتوى المزعوم فورًا.