【Selenium】使用CSS定位页面元素，根据12306、百度等几个案例来进行学习

有些代码因为不够规范，可能很多元素没有id、name，用xpath是一个好的方式。实际上CSS也不错，多学会一种定位方式，你的代码之路就越通畅。

一定要确定CSS地址可定位，且唯一

常见符号：

#表示 id选择器

.表示 class选择器

>表示子元素，层级

CSS地址可以在浏览器的Console例输入  $$("CSS地址")->回车，如果是唯一的，就可以使用。如果是多个，就不能使用

下面通过几个实际例子来进行学习。

1.https://www.12306.cn/index/index.html 

定位出发地。

CSS地址：【定位失败，以博主的能力，没找到唯一的CSS地址】

<div class="form-bd">
    <div class="input-box input-city">
        <input type="text" class="input inp-txt_select" value="" id="fromStationText">
        <input id="fromStation" type="hidden" value="BJP" name="from_station">                                                    
    </div>
</div>

2.https://kyfw.12306.cn/otn/leftTicket/init

选择日期

CSS地址：【#date_range li:nth-child(4)】或者【.sear-sel-hd li:nth-child(4)】

（class以.开头，id以#开头。:nth-child(n)的意思是父元素的第N个子元素）

<div id="date_range" class="sear-sel-hd clearfix">
<ul>
<li class="sel" alt="show"><span style="cursor: pointer;" class="first hide">01-13</span>
<span class="first">01-13 周一</span></li>

<li class=""><span style="cursor: pointer;" class="">01-14</span>
<span class="hide">01-14 周二</span></li>

<li><span style="cursor: pointer;">01-15</span>
<span class="hide">01-15 周三</span></li>

<li class=""><span style="cursor: pointer;" class="">01-16</span>
<span class="hide">01-16 周四</span></li>

</ul>
<div class="clear"></div>
</div>

3.https://www.baidu.com/

百度首页

CSS地址：【#kw】

<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">