定位多个元素、后代元素定位
学习网址：/cssselecotr.html
右键，开发者工具栏、检查，选择元素 CTRL+F,查找确定你的元素。
from playwright.sync_api import sync_playwright
# 启动 playwright driver 进程
p = sync_playwright().start()
# 启动浏览器，返回 Browser 类型对象
browser = p.chromium.launch(headless=False)
# 创建新页面，返回 Page 类型对象
page = browser.new_page()
page.goto(r"E:\playwright\stock.html")
print(page.title()) # 打印网页标题栏
# 输入通讯，点击查询。这是定位与操作，是自动化重点，后文详细讲解
page.locator('#kw').fill('通讯') # 输入通讯
page.locator('#go').click() # 点击查询
page.wait_for_timeout(2000)
# 打印所有搜索内容
lcs = page.locator(".result-item").all()
for lc in lcs:
print(lc.inner_text())
input('3...')
# 关闭浏览器
browser.close()
# 关闭 playwright driver 进程
p.stop()匹配多个元素
学习网址：/cssselecotr.html
前面已经说，如果一个 locator 表达式匹配多个元素，要获取所有的元素对应的 locator 对象，使用 all 方法
locators = page.locator('.plant').all()有时，我们只需要得到某种表达式对应的元素数量all里面一共有多少个元素，可以使用 count 方法，如下
count = page.locator('.plant').count()返回结果就是匹配的元素数量。可以根据返回结果是否为 0 判断元素是否存在
有时，我们只需要得到某种表达式对应的第一个元素，或者最后一个元素。可以使用 first 和 last 属性，如下
lct = page.locator('.plant')
print(lct.first.inner_text(), lct.last.inner_text()) #获取第一个和最后一个元素的文本也可以，通过 nth 方法，获取指定次序的元素，参数 0 表达第一个，1 表示第 2 个，比如
lct = page.locator('.plant')
print(lct.nth(1).inner_text())【限定范围找元素】我们只想在某一个div内，区域内，找到元素，并且打印出来，而不是整个网页进行选择。
学习网址：/cssselecotr.html
在bottom区域内找span元素，并且把所有的文字打印出来
from playwright.sync_api import sync_playwright
# 启动 playwright driver 进程
p = sync_playwright().start()
# 启动浏览器，返回 Browser 类型对象
browser = p.chromium.launch(headless=False)
# 创建新页面，返回 Page 类型对象
page = browser.new_page()
page.goto("https://cdn2.byhy.net/files/selenium/sample1.html")
lct = page.locator('#bottom')
print(lct.locator('span').all_inner_texts()) #在bottom区域内找span元素，并且把所有的文字打印出来
input('....')
# 关闭浏览器
browser.close()
# 关闭 playwright driver 进程
p.stop()子元素和后代元素选择
文字：HTML 中，元素内部可以包含其他元素，比如下面的 HTML 片段
<div id='container'> <div id='layer1'> #子元素 <div id='inner11'> #后代元素 <span>内层11</span> </div> <div id='inner12'> <span>内层12</span> </div> </div> <div id='layer2'> <div id='inner21'> <span>内层21</span> </div> </div> </div>
下面的一段话有些绕口，请大家细心阅读：
id 为 container 的 div 元素包含了 id 为 layer1 和 layer2 的两个 div 元素。
直接子元素
这种包含是直接包含，中间没有其他的层次的元素了。所以 id 为 layer1 和 layer2 的两个 div 元素是 id 为 container 的 div 元素的直接子元素
而 id 为 layer1 的 div 元素 又包含了 id 为 inner11 和 inner12 的两个 div 元素。中间没有其他层次的元素，所以这种包含关系也是直接子元素 关系
而对于 id 为 container 的 div 元素来说，id 为 inner11、inner12、inner22 的元素 和 两个 span 类型的元素 都不是 它的直接子元素，因为中间隔了几层。
虽然不是直接子元素，但是 它们还是在 container 的内部，可以称之为它 的后代元素
后代元素也包括了直接子元素，比如 id 为 layer1 和 layer2 的两个 div 元素 也可以说 是 id 为 container 的 div 元素 的 直接子元素，同时也是后代子元素【只要包含在内部，就是后代元素、后代元素包含直接子元素】
如果 元素 2 是 元素 1 的 直接子元素，CSS Selector 选择子元素的语法是这样的
元素 1 > 元素 2 #中间用一个大于号（我们可以理解为箭头号）
注意，最终选择的元素是 元素 2，并且要求这个 元素 2 是 元素 1 的直接子元素
也支持更多层级的选择，比如
元素 1 > 元素 2 > 元素 3 > 元素 4
示例图：直接子元素
示例图：后代元素 中间加上空格、多几个空格没关系，但是一定要有空格。就可以。
#layer1 div /或者div换成span都可以
也支持更多层级的选择，比如
元素 1 > 元素 2 > 元素 3 > 元素 4
后代元素代码案例：寻找bottom 元素下的人的span元素
from playwright.sync_api import sync_playwright
# 启动 playwright driver 进程
p = sync_playwright().start()
# 启动浏览器，返回 Browser 类型对象
browser = p.chromium.launch(headless=False)
# 创建新页面，返回 Page 类型对象
page = browser.new_page()
page.goto("https://cdn2.byhy.net/files/selenium/sample1.html")
lct = page.locator('#bottom')
print(lct.locator('span').all_inner_texts())
input('....')
# 关闭浏览器
browser.close()
# 关闭 playwright driver 进程
p.stop()后代元素代码案例：寻找bottom 元素下的人的span元素【简写】
from playwright.sync_api import sync_playwright
# 启动 playwright driver 进程
p = sync_playwright().start()
# 启动浏览器，返回 Browser 类型对象
browser = p.chromium.launch(headless=False)
# 创建新页面，返回 Page 类型对象
page = browser.new_page()
page.goto("https://cdn2.byhy.net/files/selenium/sample1.html")
lct = page.locator('#bottom spaI') #用后代选择器简写
print(lct.all_inner_texts())
input('....')
# 关闭浏览器
browser.close()
# 关闭 playwright driver 进程
p.stop()