【笔记 - web自动化02】元素定位

配置信息：python3.6+selenium3.14+chrom 72.0.3626.81

 

By定位：

by定位一共八种定位方式

1、通过标签的id

dri.find_element(By.ID,"kw")

 2、通过标签name

dri.find_element(By.NAME,"wd")

3、通过标签class也就是class name

dri.find_element(By.CLASS_NAME,"s_ipt")

5、通过标签种类

dri.find_element(By.TAG_NAME,"input")

6、通过标签之间的文本值

dri.find_element(By.LINK_TEXT,u"新闻")

7、通过标签之间的文本值的部分相连字段内容

dri.find_element(By.PARTIAL_LINK_TEXT,u"一下")    # 百度一下

8、通过xpath定位

dri.find_element(By.XPATH,"//*[@id='kw']")

9、通过css selector定位

    # 代表id属性

    . 代表class（class name）属性

--通过标签

dri.find_element(By.CSS_SELECTOR,"span")

--通过父子标签

dri.find_element(By.CSS_SELECTOR,"span>input")

--通过标签属性

dri.find_element(By.CSS_SELECTOR,"input[id='kw']")

--通过多标签

dri.find_element(By.CSS_SELECTOR,"input.kw>input>a>tr#su")

--通过标签层级关系

dri.find_element(By.CSS_SELECTOR,"//form[id='form']/span/input")

--通过单个标签多个属性

dri.find_element(By.CSS_SELECTOR,"input[id='kw'][name='wd']") 

--如果标签的 class="bg s_ipt_wr quickdelete-wrap"这种格式，则这个标签的class name有三个，用空格隔开

dri.find_element(By.CSS_SELECTOR,"span.bg.s_ipt_wr.quickdelete-wrap>input#kw")

 

id定位

dri.find_element_by_id(value)

name定位

dri.find_element_by_name(value)

class name定位

dri.find_element_by_class_name(value)

css定位

dri.find_element_by_css_selector(value)

css定位参考By定位里面的css定位

link_text定位

dri.find_element_by_link_text(value)

partial_link_text定位

dri.find_element_by_partial_link_text(value)

tag_name定位

dri.find_element_by_tag_name(value)

xpath定位

 /    从根节点选取

//    从匹配选择的当前节点选择文档中的节点，而不考虑他们的位置

 .    选取当前节点

 ..    选取当前节点的父节点

 @    选取标签属性

*     任意标签

 

--  标签：标签如果只有一个则可以不用属性

dri.find_element_by_xpath("/html/body/div/div/div/div/div/form/span/input")

--标签属性：

dri.find_element_by_xpath("//input[@id='su']")

--超链接

dri.find_element_by_xpath("//a[@href='http://home.baidu.com']")

--标签属性组合

dri.find_element_by_xpath("//input[@id='kw' and @class='s_ipt']") #属性组合的形式

--文本值定位

dri.find_element_by_xpath("//a[contains(text(),'新闻')]") #标签之间存在唯一的文本值

--模糊定位

dri.find_element_by_xpath("//a[contains(@href,'xueshu')]") #其他属性值过长时，可以使用此方法

--网页中动态属性的定位

start-with()  以...开始 

dri.find_element_by_xpath("//input[start-with(@name,'ti_trhao')]")

end-with()    以...结束

dri.find_element_by_xpath("//input[end-with(@name,'ti_trhao')]")

contains()    属性&属性值
 

dri.find_element_by_xpath("//input[contains(@id,'username')]")

--多标签多属性组合定位

dri.find_element_by_xpath("//*[@id='kw1]//input[start-with(@id,'nice')]/div[1]/form[3]")

Js定位

--通过id

document.getElementById("id")

--通过name，元素返回结果以列表展示，如果只有一个index=0

document.getElementsByName("name")[0].操作方式

--通过tag name

document.getElementsByTagName("tag")[0].操作方式

--通过class name

document.getElementsByClassName("class")[0].操作方式

--通过css方式

document.querySelectorAll( "CSS_Selector的语法")[0].操作方式

--操作方式：

    .click()     --点击  

    .value="值"     --输入文本信息，类似send_keys功能

    .clear()    --清空内容

    .removeAttribute("属性")        --移除属性

eg：
    jsusename='document.getElementById("account").clear()'
    dri.execute_script(jsusename)

--js移除日期控件的readonly属性，然后输入指定日期 ：

    js='document.getElementById("train_date").removeAttribute("readonly");'
    dri.execute_script(js)
    time.sleep(5)
    jsdate='document.getElementById("train_date").value="2019-08-16"'
    dri.execute_script(jsdate)

JQuery定位

--通过css定位

js="$('css_selector的语法').操作方式"

--jQuery方法移除属性

js="$('input[id=train_date]').removeAttr('readonly')"    #1移除属性
js="$('input[id=train_date]').Attr('readonly',false)"    #2设置为false
js="$('input[id=train_date]').removeAttr('readonly','')"    #3设置为空，同2
js="$('input[id=train_date]').click()" 
dri.execute_script(js)