css选择器：通过一定的语法定位到某一个元素，与xpath选择的功能是一样的
5.1 css选择器的常见用法
| 表达式 | 说明 |
|---|---|
| * | 选择所有节点 |
| #container | 选择id为container的节点 |
| .container | 选取所有class包含container的节点 |
| li a | 选取所有li下的所有a节点 |
| ul + p | (兄弟节点，后面的，不是子节点意思)选择ul后面的第一个p元素 |
| div#container > ul | (父子)选取id为container的div的第一个ul子元素 |
| 表达式 | 说明 |
|---|---|
| ul ~ p | 选取与ul相邻的所有p元素 |
| a[title] | 选取所有有title属性的a元素(属性有没有值都无所谓) |
| a[color="red"] | 选取所有color属性为red值的a |
| a[href*="jobbole"] | 选取所有href属性包含jobbole的a元素 |
| a[href^="http"] | 选取所有href属性值以http开头的a元素 |
| a[hre$=".jpg"] | 选取所有href属性值以.jpg结尾的a元素 |
| input[type=radio]:checked | input是元素，类型是radio，选取选中的radio的元素 |
| 表达式 | 说明 |
|---|---|
| div:not(#container) | 选取所有id非container的div元素 |
| li:nth-child(3) | 选取第三个li元素 |
| tr:nth-child(2n) | 第偶数个tr |
几乎对于所有的元素来说，用xpath和css都是可以完成定位功能的，但对前端朋友来说比较熟悉前端的写法，scrapy提供两种方法。css的写法是比xpath更简短的，在浏览器中都能直接获取。对前端熟悉的人可以优先考虑使用css选择器来定位一个元素，对于之前用xpath做实例的网页全用css选择器，代码如下：
title = response.xpath("div.entry-header h1::text").extract()[0]
# '用 Vue 编写一个长按指令'
create_date = response.css("p.entry-meta-hide-on-mobile::text").extract()[0].strip().replace("·", "").strip()
# '2018/08/22'
praise_ums = response.css(".vote-post-up h10::text").extract_first()
if praise_ums:
praise_ums = int(praise_ums)
else:
praise_ums = 0
fav_nums = response.css(".bookmark-btn::text").extract()[0]
match_re = re.match('.*?(\d+).*',fav_nums)
if match_re:
fav_nums = int(match_re.group(1))
else:
fav_nums = 0
comment_nums = response.css("a[href='#article-comment'] span::text").extract()[0]
match_re = re.match('.*?(\d+).*', comment_nums)
if match_re:
comment_nums = int(match_re.group(1))
else:
comment_nums = 0
content = response.css("div.entry").extract()[0]
tags = response.css("p.entry-meta-hide-on-mobile a::text").extract()
tag_list = [element for element in tag_list if not element.strip().endswith("评论")]
tags = ",".join(tag_list)
注意，提示一个新的函数，extract_first()，这个函数就是相当于之前的
extract()[0]，但是前者好处在于避免了当取出数组为空的情况，这时候取[0]元素是会报错的，不得不做异常处理。extract()函数可以传入参数，表示如果找到的数组为空，那么就返回默认值。比如extract("")就表示如果前面取出数组为空，那么就返回空字符串。
网友评论