Share with you today under selenium according to father and son, brothers, neighboring node positioning method, many people in the actual application will encounter the node can not directly locate, need to pass the adjacent node to relative positioning problem, but from the parent node to locate child nodes easy, from the child node location parent node, Locate a node of the Brother node is helpless, don't worry, and see the blogger step-by-step explanation.
1. Locating child nodes by parent node
The simplest of all is to locate the child node by the parent node, there are many ways to locate it, the following example:
For the following code:
To locate an ID-free child node based on the b node, the code example is as follows:
#-*-Coding:utf-8-*-from
Selenium import webdriver
driver = webdriver. Firefox ()
driver.get (' d:\\py\\autotestframework\\src\\others\\test.html ')
# 1. Series Search
Print Driver.find _element_by_id (' B '). Find_element_by_tag_name (' div '). Text
# 2.xpath Parent-child relationship looking for
print Driver.find_element_by_ XPath ("//div[@id = ' B ']/div"). Text
# 3.CSS Selector Parent-child relationship looking for
print driver.find_element_by_css_selector (' div#b >div '). Text
# 4.css selector nth-child
print driver.find_element_by_css_selector (' Div#b div:nth-child ( 1). Text
# 5.css selector nth-of-type
print driver.find_element_by_css_selector (' Div#b div:nth-of-type (1 ). Text
# 6.xpath axis child
print Driver.find_element_by_xpath ("//div[@id = ' B ']/child::d IV"). Text
Driver.quit ()
Results:
Parent to Child
Parent to Child
Parent to Child
Parent to Child
Parent to Child
Parent to Child
The 1th to the 3rd are the familiar ways, and we will not say much more. The 4th method uses the CSS selector: nth-child (n), which returns the Nth node, which is a div tag, and the 5th method uses another CSS selector: Nth-of-type (n), which returns the nth DIV tag, noting the difference from the previous selector The 6th method uses the XPath axis child, which is the XPath default axis, which can be ignored and not written, and is essentially the same as Method 2.
Of course, there are some of the CSS selector can choose father-son relationship such as Last-child, Nth-last-child, interested can own Baidu, have the opportunity to talk about the main blog CSS selector.
2. Locating parent nodes by child nodes
It is a bit difficult for a child node to navigate to the parent node, for the following code:
We want the div with the C node to locate its two-tier parent node, and the sample code is as follows:
#-*-Coding:utf-8-*-from
Selenium import webdriver
driver = webdriver. Firefox ()
driver.get (' d:\\py\\autotestframework\\src\\others\\test.html ')
# 1.xpath: '. ' Represents the current node; '..' Represents the parent node
print Driver.find_element_by_xpath (//div[@id = ' C ']/... /.."). Text
# 2.xpath axis parent
print Driver.find_element_by_xpath ("//div[@id = ' C ']/parent::*/parent::d IV"). Text
Driver.quit ()
Results:
Child to Parent
Child to Parent
Here we have two ways, the 1th is. The form, just as we know,. Represents the current node,.. Represents the parent node; the 2nd approach, like the above, is one of the XPath axes: parent, taking the parent node of the current node. This is also a pain point for CSS selector, because the CSS design does not allow the ability to get the parent node (at least not currently)
3. Locate brother node by Brother node
This is the 3rd and 4th situation, we are here to locate the sibling node. such as the following source code:
How to locate its brother node through D-node? See code example:
#-*-Coding:utf-8-*-from
Selenium import webdriver
driver = webdriver. Firefox ()
driver.get (' d:\\code\\py\\autotestframework\\src\\others\\test.html ')
# 1.xpath, Gets its brother node
print Driver.find_element_by_xpath ("//div[@id = ' D ']/) through the parent node. /DIV[1] "). Text
# 2.xpath axis preceding-sibling
print Driver.find_element_by_xpath ("//div[@id = ' D ']/ Preceding-sibling::d iv[1] "). Text
driver.quit ()
Results
Brother 1
Brother 1
Here the blogger also enumerates two methods, one is to obtain the sibling node through the node's parent node, another kind is more elegant, is through the XPath axis: preceding-sibling, it can obtain the current node all siblings sibling node, notices in parentheses the marking, 1 Represents the closest sibling node to the current node, the larger the number means the farther away from the current node, of course, the XPath axis: preceding, but it's more complicated to get to all the non-ancestor nodes before that node (this is not a good explanation, but I'll write a blog post to explain all the axes).
4. Locate brother node by Brother node
Source code and 3 in line with, want to go through the D node to locate their brother node, look at the example:
#-*-Coding:utf-8-*-from
Selenium import webdriver
driver = webdriver. Firefox ()
driver.get (' d:\\code\\py\\autotestframework\\src\\others\\test.html ')
# 1.xpath, acquiring its brother node via parent node
print Driver.find_element_by_xpath ("//div[@id = ' D ']/... /DIV[3] "). Text
# 2.xpath axis following-sibling
print Driver.find_element_by_xpath ("//div[@id = ' D ']/ Following-sibling::d iv[1] "). Text
# 3.xpath axis following
print Driver.find_element_by_xpath ("//div[@id = ' D ']/ Following::* "). Text
# 4.CSS selector +
print driver.find_element_by_css_selector (' div#d + div '). Text
# 5.CSS Selector ~
print driver.find_element_by_css_selector (' div#d ~ div '). Text
driver.quit ()
Results:
Brother 2
Brother 2
Brother 2
Brother 2
Brother 2
Bloggers have shared five ways to locate their younger siblings, the top three of which are in XPath, the first is well understood, and the second uses the XPath axis: following-sibling, similar to preceding-sibling, is used to get all sibling siblings of the current node, Similarly, 1 represents a brother node closest to the current node, the larger the number indicates the farther away from the current node; The third uses an XPath axis: following, after which all nodes, except the ancestor node (contrary to the preceding direction, are not prone to error, because they are easy to read in the lower order). So it can also be used to get the brother node, but it is not recommended to use it; the third, fifth, we use the CSS selector,+ and ~ is the difference is: + represents immediately after the current node div node, ~ represents the current node after the DIV node, if used Find_elements , you can get to a set of DIV nodes.
The above is a small series to introduce you to the Python selenium father and son, brothers, the adjacent node positioning method of all the narration, I hope to help you, if you have any questions welcome to my message, small series will promptly reply to everyone, here also thank you for your support cloud Habitat community site!