前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Scrapy实战6:CSS选择器实战训练

Scrapy实战6:CSS选择器实战训练

作者头像
龙哥
发布2020-02-12 11:10:29
9490
发布2020-02-12 11:10:29
举报
文章被收录于专栏:Python绿色通道Python绿色通道

一、 前言

上一篇文章Scrapy实战5:Xpath实战训练中给大家讲解并带着大家实战训练了Xpath,爬取了伯乐在线文章的基本信息,并且介绍scrapy里的shell调试模式使用,还是很实用的哈。

本篇将给大家讲解CSS选择器,以及一起实战练习,牢记基础语法知识。

二、CSS选择器简介

1.维基百科看CSS
代码语言:javascript
复制
层叠样式表(英语:Cascading Style Sheets,简写CSS),又称串样式列表、级联样式表、串接样式表、
阶层式样式表,一种用来为结构化文档(如HTML文档或XML应用)添加样式(字体、间距和颜色等)的计算机
语言,由W3C定义和维护。目前最新版本是CSS2.1,为W3C的推荐标准。CSS3现在已被大部分现代浏览器支持
,而下一版的CSS4仍在开发中。
2.百度百科看CSS选择器
代码语言:javascript
复制
要使用css对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。
HTML页面中的元素就是通过CSS选择器进行控制的。
每一条css样式定义由两部分组成,形式如下:[code] 选择器{样式} [/code] 在{}之前的部分就是“选择
器”。 “选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元素。
3.CSS选择器常用类型
代码语言:javascript
复制
常用的大CSS选择器:
# 1.元素选择器:又称为标签选择器,根据标签名来固定样式作用范围。
eg.对页面所有p标签样式限定:
p{
font-size:px;  # 字体大小
background:#900;  # 背景颜色
}

# 2.类选择器:即根据元素(标签)的class属性来固定样式作用范围。(class不是唯一的)
eg.设置class为demoDiv的div块颜色
.demoDiv{
color:#FF0000;
}

# 3.ID选择器:即根据元素(标签)的id属性来固定样式作用范围。(ID是唯一的)
eg.设置id为demoDiv的div块颜色
#demoDiv{
color:#FF0000; 
}

# 4.后代选择器:又称为包含选择器,用来选择特定元素或元素组的后代,将对父元素的选择放在前面,对子元素的选择放在后面,中间加一个空格分开。
eg.设置id为links的后代中标签a为红色
#links a {
color:red;
}

# 5.子选择器:子选择器(child selector)仅是指它的直接后代,或者你可以理解为作用于子元素的第一个
后代,通过“>”进行选择。
eg.设置id为links的后代中第一个a标签为蓝色
#links > a {
color:blue;
}
当然还有很多css选择器,比如伪类选择器、通用选择器、群组选择器等,我就不赘述了,大家要用百度谷歌
一下就可以了嘿嘿。
4.CSS选择器常用语法

常用语法01

常用语法02

常用语法03

三、看代码,边学边敲边记CSS选择器

1.cmd下进入虚拟环境并且利用`scrapy shell`调试
代码语言:javascript
复制
C:\Users\\Desktop>workon spiderenv
(spiderenv) C:\Users\\Desktop>scrapy shell http://python.jobbole.com//
2.在cmd下利用shell模式获取文章信息

(1)F12分析页面(这次我选取的页面网址为:http://python.jobbole.com/89196/)

F12下分析页面

通过分析我们可以看出,文章标题是在classentry-headerdiv下的h1标签下(页面查询知entry-header类名全局唯一)。

(2)通过类选择器和后代选择器综合运用,取出文章标题

代码语言:javascript
复制
>>> response.css(".entry-header h1").extract()
['<h1>爬虫进阶:反反爬虫技巧</h1>']

我们发现文章标题并没被完全取出,还是被h1标签包裹着,有两种方法获取文字:

  • 方法一:正则表达式获取(麻烦)
代码语言:javascript
复制
>>> title = response.css(".entry-header h1").extract()[]
>>> reg_01 = "<h1>(.*?)</h1>"
>>> title = re.findall(reg_01,title)[]
>>> title
'爬虫进阶:反反爬虫技巧'
  • 方法二:伪类选择器(简单)
代码语言:javascript
复制
>>> title = response.css(".entry-header h1 ::text").extract()[]
>>> title
'爬虫进阶:反反爬虫技巧'

# title = response.css(".entry-header h1 ::text").extract()[0]

方法二是不是超级简单,瞬间爱死CSS了。 (3)我们继续获取其他数据(复习巩固一下CSS的用法)

  • 获取文章发布时间
代码语言:javascript
复制
'''
预备小知识:
1.str.strip():可以去除str里左右两端的空格和\n,\r。
2.str.replace("a","b"):将str里所有的a由b代替。
'''
# 文章发布时间
>>> data_r = response.css(".entry-meta-hide-on-mobile::text").extract()[]
>>> data_r
'\r\n\r\n            2018/06/28 ·  '
>>> data_r = data_r.strip()
>>> data_r
'2018/06/28 ·'
>>> data_time = data_r.replace('·','').strip()
>>> data_time
'2018/06/28'

# data_r = response.css(".entry-meta-hide-on-mobile::text").extract()[0].strip()
# data_time = data_r.replace('·','').strip()
  • 获取文章点赞数、收藏数、评论数
代码语言:javascript
复制
# 点赞数:h10下id为89196votetotal,因为页面内该id值唯一,故可以直接用id选择器
>>> response.css("#89196votetotal::text").extract()[]
'2'

# praise_number = int(response.css("#89196votetotal::text").extract()[0])

# 收藏数:a:nth-child(2)表示选取a标签的第二个元素
>>> response.css("span.btn-bluet-bigger:nth-child(2)::text").extract()[]
' 6 收藏'
>>> import re
>>> reg_02 = '.*(\d+).*'
>>> collection_str = response.css("span.btn-bluet-bigger:nth-child(2)::text").extract()[]
>>> re.findall(reg_02,collection_str)[]
'6'

# collection_str = response.css("span.btn-bluet-bigger:nth-child(2)::text").extract()[0]
#  reg_02 = '.*(\d+).*'
# collection_number = int(re.findall(reg_02,collection_str)[0])

# 评论数:X先生这次选择的又是没有评论的,可谓良苦用心,只为了让大家自己多动动脑袋,多想想,
# 哈哈哈
>>> response.css("span.hide-on-480::text").extract()[]
'  评论'
# 如果有评论的话,和收藏数一样,用正则表达式匹配数字即可,自己找篇有评论的试试吧~

(4)详解CSS选择器获取文章简介、文章类型获取

1) 文章简介获取

F12分析文章简介CSS选择器

从上面可以看到,文章的简介内容放在了:class为entry的div的第二子类(blockquote标签),他(blockquote)的第一个子类(p标签)中,所以我们推导出图上的CSS选择器,代码如下:

代码语言:javascript
复制
>>> response.css(".entry > blockquote:nth-child(2) > p:nth-child(1)::text").extract()[]
'主要针对以下四种反爬技术:Useragent过滤;模糊的Javascript重定向;验证码;请求头一致性检查。'

# summary = response.css(".entry > blockquote:nth-child(2) > p:nth-child(1)::text").extract()[0]

2) 文章分类

F12分析文章类别CSS选择器

从上面可以看出文章类型分为两部分:前面+后面,前面类型(实践项目):在class为entry-meta-hide-on-mobile的p标签的后代中的第一个a标签中,后面类型(爬虫):在class为entry-meta-hide-on-mobile的p标签的后代中的第二个a标签中,所以我们推导出图上的CSS选择器,代码如下:

代码语言:javascript
复制
>>> response.css(".entry-meta-hide-on-mobile > a:nth-child(1)::text").extract()[]
'实践项目'
>>> response.css(".entry-meta-hide-on-mobile > a:nth-child(2)::text").extract()[]
'爬虫'

# type_01 = response.css(".entry-meta-hide-on-mobile > a:nth-child(1)::text").extract()[0]
# type_02 = response.css(".entry-meta-hide-on-mobile > a:nth-child(2)::text").extract()[0]
# article_type = type_01 + "·" + type_02
3.现在`jobbole.py`中的代码及运行结果

代码:

代码语言:javascript
复制
# -*- coding: utf-8 -*-
import scrapy
import re

class JobboleSpider(scrapy.Spider):
    name = 'jobbole'
    allowed_domains = ['blog.jobbole.com']
    start_urls = ['http://python.jobbole.com/89196/']

    def parse(self, response):
        # CSS选择器实战
        # 文章标题
        title = response.css(".entry-header h1 ::text").extract()[]
        # 发布日期
        data_r = response.css(".entry-meta-hide-on-mobile::text").extract()[].strip()
        data_time = data_r.replace('·','').strip()
        # 文章分类
        type_01 = response.css(".entry-meta-hide-on-mobile > a:nth-child(1)::text").extract()[]
        type_02 = response.css(".entry-meta-hide-on-mobile > a:nth-child(2)::text").extract()[]
        article_type = type_01 + "·" + type_02

        # 文章简介
        summary = response.css(".entry > blockquote:nth-child(2) > p:nth-child(1)::text").extract()[]
        # 点赞数
        praise_number = int( response.css("#89196votetotal::text").extract()[])
        # 收藏数
        collection_str = response.css("span.btn-bluet-bigger:nth-child(2)::text").extract()[]
        reg_02 = '.*?(\d+).*'
        collection_number = int(re.findall(reg_02,collection_str)[])

        print("文章标题:"+title)
        print("发布日期:"+data_time)
        print("文章分类:"+article_type)
        print("文章简介:"+summary)
        print("点赞数:"+str(praise_number))
        print("收藏数:"+str(collection_number))

运行结果:

代码语言:javascript
复制
文章标题:爬虫进阶:反反爬虫技巧
发布日期://
文章分类:实践项目·爬虫
文章简介:主要针对以下四种反爬技术:Useragent过滤;模糊的Javascript重定向;验证码;请求头一致性检查。
点赞数:
收藏数:

四、后言

学完这一期,大家也许觉得好像和之前Xpath实战没有什么区别,但是我想告诉大家的是:Xpath和CSS选择器的确有相同功能,但实现的原理是不同的,一般来说大家掌握一种就好了,那为什么还要给大家介绍两种呢?如果大家两篇都有看的话,就会发现有些地方使用CSS选择器会更加简单,而有些地方又用Xpath似乎更好,而且对于前端有优势的同学,使用CSS选择器的话学起来就更比啦!

【完】

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-01-08,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 Python绿色通道 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、 前言
  • 二、CSS选择器简介
  • 三、看代码,边学边敲边记CSS选择器
    • 1.cmd下进入虚拟环境并且利用`scrapy shell`调试
      • 2.在cmd下利用shell模式获取文章信息
        • 3.现在`jobbole.py`中的代码及运行结果
        • 四、后言
        相关产品与服务
        验证码
        腾讯云新一代行为验证码(Captcha),基于十道安全栅栏, 为网页、App、小程序开发者打造立体、全面的人机验证。最大程度保护注册登录、活动秒杀、点赞发帖、数据保护等各大场景下业务安全的同时,提供更精细化的用户体验。
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档