python css选择器用法

想优化一下刚刚写的爬虫，改一下Selectors
去看文档 眼花缭乱 ，所以想在这里总结一下Selectors 的简单用法，
不扯别的，就是学会用 ，简单粗暴的学会用法
我们不如还拿拉勾网实验可好 滑稽.jpg
https://www.lagou.com/zhaopin/Java/

打开这个页面，国际惯例F12

看到了网页的源代码，我们想从这个里面取到需要的数据，就用到了选择器

相信用到Selectors的小伙伴们都已经建好scrapy项目了，所以我不做赘述
只需要在spiders文件夹下面新建一个forth.py文件内容如下：

import scrapy
from First.items import FirstItem

class Lagou(scrapy.Spider):
    name = "forth"
    start_urls = [
        "https://www.lagou.com/zhaopin/Java/"
    ]


    def parse(self , response):
        pass

 
 

 
 
1
2
3
4
5
6
7
8
9
10
11
12
13

这篇文章会讲解到的css选择器有

1. #container 选择id为container的元素
2. .container 选择所有class包含container的元素
3. * 选择所有元素
4. div a 选取所有div下所有a元素
5. ul + p 选取ul后面的第一个p元素
6. ul ~p 选取与ul相邻的所有p元素
7. a:nth-child(2) 选取下面第二个标签，如果是a的话则选取，不是则不取
8. a:nth-child(2n) 选取第偶数个a元素
9. a:nth-child(2n+1) 选取第奇数个a元素
10. li.multi-chosen > a 选取class为multi-chosen的li的所有a元素
11. a[title] 选取所有拥有title属性的a元素
12. a[href=”https://www.lagou.com/jobs/3537439.html”] 选取所有href属性为https://www.lagou.com/jobs/3537439.html的a元素
13. a[href*=”www.lagou.com”] 选取所有href属性值中包含www.lagou.com的a元素
14. a[href^=”http”] 选取所有href属性值中以http开头的a元素
15. div:not(#content-container) 选取所有id为非content-container 的div

开始测试css选择器

• #container 选择id为container的元素
• .container 选择所有class包含container的元素
• * 选择所有元素

假如我们想获取到

中的所有内容

点击调试工具中的箭头，再点击左侧想获得信息的区域，可以快速的找到这一段html代码的位置

可以看到所有的信息都在class = .con_list_item 的li标签之中

    def parse(self , response):
        for item in response.css('.con_list_item *'):
            jobMessage = item.css('::text').extract()
            print(jobMessage)
 
 

 
 
1
2
3
4

修改parse方法中的选择器 ，
使用 .con_list_item * 来找到class为con_list_item 下的所有节点
用jobMessage来接收 ：：text 是取出标签中的内容
为了提取真实的原文数据，需要调用 .extract() 方法
运行名为forth的爬虫~

scrapy crawl forth
 
 

 
 
1

结果如下

拿到数据了~ 虽然很乱但是拿到了对吧~ 说明我们的selectors成功了

*是拿到所有节点，那么要拿到单独节点呢？
找一个看起来容易找到的节点

看！ 这个h3正合我们的胃口
修改parse方法

    def parse(self , response):
        for item in response.css('.con_list_item h3'):
            jobMessage = item.css('::text').extract()
            print(jobMessage)
 
 

 
 
1
2
3
4

再次运行爬虫 ， 结果如下

获取到了所有的h3

接下来测试 #container 根据id选择内容
历尽千辛万苦找到一个id

基础知识大家已经知道了
所以直接上代码

    def parse(self , response):
        for item in response.css('#lg_tnav h1'):
            jobMessage = item.css('::text').extract()
            print(jobMessage)
 
 

 
 
1
2
3
4

获取id 为lg_tnav 下的 h1标签中的内容
运行爬虫 ， 出现吧 皮卡丘

接着学习别的

• div a 选取所有div下所有a元素

只需要修改为

for item in response.css('div a'):
 
 

 
 
1

运行出现结果

• ul + p 选取ul后面的第一个p元素

经过挑选，我觉得下面这个例子挺不错的

工作地点是一个span标签 它后面的内容有一大堆，假如我们只想取第一个 那么就是一个a标签
先取出“工作地点”

 def parse(self , response):
        for item in response.css('.title'):
            jobMessage = item.css('::text').extract()
            print(jobMessage)
 
 

 
 
1
2
3
4

运行爬虫，结果如下

接着取出它后面a标签
只需改动一处

for item in response.css('.title + a'):
 
 

 
 
1

运行得到了它后面的a标签中的内容

• ul ~p 选取与ul相邻的所有p元素

我们甚至还可以用上面的例子
改动一处

for item in response.css('.title ~ a'):
 
 

 
 
1

运行得到结果

是不是都得到了呢

• a:nth-child(2) 选取下面第二个标签，如果是a的话则选取，不是则不取

接着使用这个例子，需要注意的是在这里
“2”所指的是第一个子标签，span标签
“3”所指的是第二个子标签，a标签

修改代码如下

    def parse(self , response):
        for item in response.css('.multi-chosen'):
            jobMessage = item.css('a:nth-child(2)::text').extract()
            print(jobMessage)

 
 

 
 
1
2
3
4
5

结果如下

如果我们修改一行代码，取第一个a标签

jobMessage = item.css('a:nth-child(1)::text').extract()
 
 

 
 
1

结果如下：

取出的数据为空，为什么呢？ 因为第一个标签不是a标签，而是span标签，所以不取。
再次修改为以下语句，取出第一个span标签

jobMessage = item.css('span:nth-child(1)::text').extract()
 
 

 
 
1

运行，成功获取到了第一个标签

由此可得，需要同时匹配标签和位置才可以取出元素

• a:nth-child(2n) 选取第偶数个a元素

我们叒使用之前的例子，只需要修改一句

jobMessage = item.css('a:nth-child(2n)::text').extract()
 
 

 
 
1

运行获得结果


成功的取出第偶数个a元素
那么类比可得

• a:nth-child(2n+1) 选取第奇数个a元素
  测试一下

jobMessage = item.css('a:nth-child(2n+1)::text').extract()
 
 

 
 
1

成功的取出的第奇数个a元素中的内容
为什么没有取出第一条内容“工作经验” 呢？
当然是因为它是span标签中的内容，而不是a标签中的内容
如果我们用

jobMessage = item.css('span:nth-child(2n+1)::text').extract()
 
 

 
 
1

就可以取出它了

• li.multi-chosen > a 选取class为multi-chosen的li的所有a元素

我们叕用上面的例子，修改代码如下

    def parse(self , response):
        for item in response.css('li.multi-chosen > a'):
            jobMessage = item.css('::text').extract()
            print(jobMessage)
 
 

 
 
1
2
3
4

运行，成功获得了class为multi-chosen的li下的所有a元素

• a[title] 选取所有拥有title属性的a元素

又叕用上面的例子，就决定是这一条属性了

修改代码如下

    def parse(self , response):
        for item in response.css('a[data-lg-tj-no]'):
            jobMessage = item.css('::text').extract()
            print(jobMessage)
 
 

 
 
1
2
3
4

运行，成功获取到结果

• a[href=”https://www.lagou.com/jobs/3537439.html”] 选取所有href属性为https://www.lagou.com/jobs/3537439.html的a元素

终于要换一个例子了，请看！

要取出href=”https://www.lagou.com/jobs/3537439.html”的a标签 下 h3标签中的内容
代码如下

for item in response.css('a[href="https://www.lagou.com/jobs/3537439.html"] h3'):
            jobMessage = item.css('::text').extract()
 
 

 
 
1
2

运行，获得结果

• a[href*=”www.lagou.com”] 选取所有href属性值中包含www.lagou.com的a元素

修改代码

for item in response.css('a[href*="www.lagou.com"] h3'):
 
 

 
 
1

运行

• a[href^=”http”] 选取所有href属性值中以http开头的a元素

修改代码

for item in response.css('a[href^="http"]'):
            jobMessage = item.css('::text').extract()
 
 

 
 
1
2

运行获得了一大堆数据

• div:not(#content-container) 选取所有id为非content-container 的div

页面的结构分上下两部分，头部的id 为lg_header ， 下部的id为content-container
为了选取上部分，我们有两种方法
1.#lg_header 或者 div:not(#content-container)

修改代码如下

for item in response.css('div:not(#content-container) h1'):
            jobMessage = item.css('::text').extract()
 
 

 
 
1
2

运行可以得到

大概就是这么多了，这篇文章主要是写了css选择器的使用。
有时候css ， xpath选择器组合使用，可以简单的获取到数据。有时间的话我会再写一篇xpath选择器的用法