总结
1.css选择器介绍
- 在css中选择器是一种模式,用于选择需要添加样式的元素,css对html页面中的元素实现一对一,一对多或者多对一的控制,都需要用到css选择器,html页面中的元素就是通过css选择器进行控制的;
2.css选择器的基本语法
-
类选择器:元素的class属性,比如
class="box"
表示选取class为box的元素; -
ID选择器:元素的id属性,比如
id="box"
表示选取id为box的元素; -
元素选择器:直接选择文档元素,比如p表示选择所有的p元素,div表示选择所有的div元素;
-
属性选择器:选择具有某个属性的元素,如
*[title]
表示选择所有包含title
属性的元素、a[href]
表示选择所有带有href属性的a元素等; -
后代选择器:选择包含元素后代的元素,如
li a
表示选取所有li 下所有a元素; -
子元素选择器:选择作为某元素子元素的元素,如
h1 > strong
表示选择父元素为h1 的所有 strong 元素; -
相邻兄弟选择器:选择紧接在另一元素后的元素,且二者有相同父元素,如h1 + p表示选择紧接在 h1 元素之后的所有p元素;
3.scrapy 中的css使用方法
以a元素来举例说明
-
response.css('a')
:返回的是selector对象; -
response.css('a').extract()
:返回的是a标签对象; -
response.css('a::text').extract_first()
:返回的是第一个a标签中文本的值; -
response.css('a::attr(href)').extract_first()
:返回的是第一个a标签中href属性的值; -
response.css('a[href*=image]::attr(href)').extract()
:返回所有a标签中href属性包含image的值; -
response.css('a[href*=image] img::attr(src)').extract()
:返回所有a标签下image标签的src属性;
4.如何获取元素的跳转链接和图片地址
-
首先可以使用css选择器提取元素的href链接地址或者图片的src地址,这里需要用到urllib库中的
parse.urljoin()
方法,用它来拼接获取到的元素中的路径,使之变为绝对路径; -
urljoin(baes,url[,allow_frafments])
,其中参数base作为基地址,与第二个参数为相对路径的url相结合,组成一个绝对URl地址,其中参数allow_fragments可根据自己的需求设置;
5.如何快速获取页面中的元素
-
获取xpath选择器的元素:选择标签->鼠标右键->copy->Copy XPath;
-
获取css选择器的元素:可以使用第三方插件Chrome的开发者调试工具获取,需要下载CSS Select插件->然后直接选择标签元素;