前端基础
HTML 页面静态
selenium
# selelnium安装:
# pip install selenium
# webdriver浏览器驱动安装(以谷歌浏览器驱动为例):下载chromedriver放到python安装目录下即可免配置环境变量
from selenium.webdriver import Chrome
import time
# selenium基本使用
# 打开浏览器进入百度网页
br = Chrome()
br.get('https://www.baidu.com/')
time.sleep(1)
# 窗口最小化
br.minimize_window()
time.sleep(1) # 等待1秒 休眠
# 窗口最大化
br.maximize_window()
time.sleep(1)
# 打开淘宝网
br.get('https://www.taobao.com/')
time.sleep(1)
# 后退
br.back()
time.sleep(1)
# 前进
br.forward()
time.sleep(1)
# 刷新
br.refresh()
time.sleep(3)
# 页面截图，传的是图片保存的路径和名称
br.save_screenshot('001.png')
# 关闭并退出进程driver
br.quit()
# 关闭当前窗口，进程还在运行
# br.close()from selenium.webdriver import Chrome
import time
# br对象的属性
br = Chrome()
br.get('https://www.baidu.com/')
time.sleep(1)
br.find_element_by_link_text('地图').click()
time.sleep(3)
# 获取当前窗口URL地址
res = br.current_url
print(res) # https://www.baidu.com/
# 获取当前窗口的标题
res = br.title
print(res) # 百度一下，你就知道
# 获取当前窗口的句柄，返回字符串；每次运行返回值会变化
res = br.current_window_handle
print(res) # CDwindow-8BFE75A7D5E2DC2A6BE9B5A0C3DD17D2
# 获取所有窗口的句柄，返回列表；每次运行返回值会变化
res = br.window_handles
print(res) # ['CDwindow-8BFE75A7D5E2DC2A6BE9B5A0C3DD17D2', 'CDwindow-7517DE029832C276D1B517D0EAB34DDC']
br.quit()# 基本元素定位方法
# 比较常用的有id,xpath,css
import time
from selenium.webdriver import Chrome
br = Chrome()
br.get('https://www.baidu.com/')
time.sleep(1)
# find_element_by_id('kw') 通过元素id进行定位；send_keys('足彩') 往input框内输入内容
# br.find_element_by_id('kw').send_keys('足彩')
# time.sleep(1)
# click() 点击元素
# br.find_element_by_id('su').click()
# time.sleep(3)
# find_element_by_link_text('地图') 通过链接标签(a标签)的文本定位元素；文本需完全一致；非链接标签则不能通过该方式否则会报错
# br.find_element_by_link_text('地图').click()
# find_element_by_partial_link_text('地') 通过链接标签(a标签)的文本定位元素(部分匹配查找)
# 如果有多个符合则只会点击第一个；如果找到多个说明这种元素定位不合理，可能会造成代码不稳定；尽量使用只能定位唯一元素的方法
# br.find_element_by_partial_link_text('地').click()
# 通过标签名去查找，会查到很多不能唯一定位，不常用
# br.find_element_by_tag_name('input')
# 通过标签名去查找，会查到很多不能唯一定位，不常用；如果元素class有多个值，只能传一个，否则会报错
# br.find_element_by_class_name('s_ipt')
# 通过name属性去查找
# br.find_element_by_name('wd')
# 使用xpath定位
# br.find_element_by_xpath('//*[@id="kw"]').send_keys('大西瓜')
# 使用css定位
br.find_element_by_css_selector('#kw').send_keys('小菠萝')
time.sleep(3)
br.quit()
find_element vs find_elements
- 单数和复数
- 得到的结果 前者是一个 WebElement 对象， 代表页面当中的一个元素
后者得到的是一个列表，列表是0个， 1 个或者多个元素
- 如果找不到元素，前者会报错，后者得到一个空列表webelement 操作
- el.text 获取文本
- el.get_attribute("id") 获取某个字段的值
- el.click() 点击
- el.send_keys() 输入
- el.clear() 清空
代码运行中出错中断，不会自动关闭webdrivers，可使用cmd命令关闭多于进程
html
标签名, 大部分标签是成双成对的，
属性： id='kw' name='wd'
内嵌标签：<a>text <span></span></a>
整个网页就是一个标签， <html></html>
head内常用标签
body常用标签
不加标签的纯文字也是可以在body中写的
<b>加粗</b>
<i>斜体</i>
<u>下划线</u>
<s>删除</s>
<p>段落标签</p> #独占一个段落
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
<!--换行-->
<br>
<!--水平线--><hr> #就是单独个一个水平线
<div>空白块，会换行</div>
<span>空白块，不会换行</span>
<img src="图片的路径">
<a href="http://www.baidu.com" target="_blank" >超链接标签</a>
herf属性是指目标地址
input标签
<iframe src="http://www.baidu.com"> </iframe> 嵌套另一个网页
<form action="http://httpbin.org/post" method="post"> form表单，提交数据到后台
<div>
用户名:<input name="username" placeholder="请输入用户名" required>
<div>
密码:<input name="pwd" type="password" placeholder="请输入密码" required>
</div>
</div>
<input type="submit">
<div>
</div> </form>
<input type="radio" name="faver_singer" value="周杰伦"> 单选框
<input type="checkbox" name="handsome_man" value="yuze"> 多选框
<input type="file" name="myfile"> 上传文件
<select name="sl"> 下拉选择框
<option>布德泽</option>
<option>jianjian</option>
<option>huajingyi</option>
<option>萌萌</option>
</select>
<form> 定义供用户输入的HTML表单
<select> 定义选择列表（下拉列表）
<option> 定义选择列表中的选项
input属性说明：
name：表单提交时的“键”，注意和id的区别
value：表单提交时对应项的值
type="button", "reset", "submit"时，为按钮上显示的文本年内容
type="text","password","hidden"时，为输入框的初始值
type="checkbox", "radio", "file"，为输入相关联的值
checked：radio和checkbox默认被选中的项
readonly：text和password设置只读
disabled：所有input均适用
file:///D:/0423/040114/%E7%AC%AC32%E8%AF%BE_%E5%85%83%E7%B4%A0%E5%AE%9A%E4%BD%8D%E5%92%8Chtml/d3_demo.html
元素定位方式：
1， id 通过前端源代码当中的 <input id='kw'> 优先使用，ID唯一
2, name <input name='wd'> 常用于定位input元素
3, class name <input class='s_ipt'> 使用此种方式 字符串内不支持带空格
4, link text 是通过超链接元素的文本 定位超链接元素
5, partial link text 是通过超链接元素的部分文本 定位超链接元素
6, tag name 元素名称，标签名 基本不用
7, xpath 功能非常强大的元素查找方法
8, css selector 功能非常强大的元素查找方法元素定位原则：
1：不管通过什么方式查找元素，请确保你找到的元素要是唯一的，不会存在多个
2：如果通过某种方式找元素，能找到两个，怎么办？
方法1：加索引
方法2：使用复合条件 name and class_name and tagname : xpath css
3: 不论通过什么属性方式查找元素，如果你发现某个属性的值可能是会动态变化的，不要使用该属性定位元素。
- 如属性值当中包含了数字， p1 table2
相对路径和绝对路径定位：
绝对路径比较长，相对路径更简洁；
相对路径更可靠，当前端页面发生变化时，相对路径可能不需要改变，绝对路径可能会改变；
所以经常使用相对路径。
xpath索引从1开始，前面需要加()括号提高运算优先级，因为xpath索引运算优先级比较高
(//a[@class=' '])[1]
xpath and 组合条件
//a[@class=' ' and @name=' ' and @id=' ']
通过爸爸找儿子
//span[@name=' ']/input[@name=' ']
通过祖先找后代
//span[@name=' ']//input[@name=' ']
通过儿子找父亲，祖辈
//a[@class=' ']/..
//a[@class=' ']/../..
text()文本查找
contains() 包含
//a[contains(text(),'视频 ') ]
//a[contains(@class,'s_ipt ') ]
//*[@name] 代表有name属性的任意元素
轴运算
//input[@id='kw']//parent::span 父级
//input[@id='kw']//preceding-sibling::span 哥
//input[@id='kw']//following-sibling::span 弟
xpath定位方式
//a[@class=' ']
(//a[@class=' '])[1]
//a[@class=' ' and @name=' ' and @id=' ']
//span[@name=' ']/input[@name=' ']
//span[@name=' ']//input[@name=' ']
定位表达式有多个元素时，如果确定用的是第一个可以直接用find_element，不建议使用
复制xpath和css如图
xpath定位
下标取值慎用
xpath和css比较
css写法更简洁，速度更快，但是不支持文本定位，只支持层级往下去找，不支持层级向上定位
xpath功能更强，对于复杂定位反而更简洁，支持同层级定位，更灵活
366
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
