19 - 爬虫与前端

最新推荐文章于 2024-01-13 11:17:06 发布

Mr_suyi

最新推荐文章于 2024-01-13 11:17:06 发布

阅读量205

点赞数

分类专栏： python HTML 文章标签：爬虫前端 python

本文链接：https://blog.csdn.net/mr_suyi/article/details/126292077

版权

python 同时被 2 个专栏收录

36 篇文章 0 订阅

订阅专栏

HTML

5 篇文章 0 订阅

订阅专栏

Day 19

一、requests的基本用法

1.什么是爬虫

获取网络数据（公开的数据）
网络数据来源：1. 网站对应的网页、2. 手机app

2.爬虫的基本流程

第一步：获取网络数据（requests、selenium)
第二步：解释数据 — 从获取的数据中提取有效数据（正则、bs4、lxml）
第三步：保存数据（csv、excel、数据等）

3. requests — python获取网络数据的第三方库（基于http或者https协议的网络请求）

爬虫使用requests的两个场景：直接请求网页地址、对提供网页数据的数据接口发送请求

4. requests的基本用法

requests.get(网页地址) - 获取指定页面的数据返回一个响应对象

# 1）对目标网页直接发送请求:
# requests.get(网页地址)        -       获取指定页面的数据返回一个响应对象
response = requests.get('https://cd.zu.ke.com/zufang')
print(response)     # <Response [200]>      200 - 请求成功

# 获取响应的状态码
print(response.status_code)
if response.status_code == 200:
    pass

# 获取响应头
print(response.headers)


# 请求内容（返回的真正有用的数据）
"""
response.content        -       二进制类型的数据(图片、视频、音频等， 例如：图片下载)
response.text           -       字符串类型的数据(网页)
response.json()         -       对请求内容做完json解析后的数据（json数据接口）
"""

print('--------------------------------------------------分割线---------------------------------------------------')
print(response.text)

二、认识前段开发

如果要使用爬虫我们必须具备一定的前端知识来，来获取想要爬取的内容。

1.认识前端开发

前段开发：写各种互联网产品的页面（电脑端应用程序除外）
前端开发的相关技术：html、css、JavaScript、jQuery、Vue…
- html：负责网页内容
- css：负责网页内容的样式和布局
- JavaScript：负责网页内容变化

2.html基础

1.标签的语法结构

双标签：<标签名属性名 = 属性值> 标签内容 </标签名>
单标签：<标签名属性名1 = 属性值1 属性名2 = 属性值2… > 或者 <标签名属性名1 = 属性值1 属性名2 = 属性值2… />（单标签单独出现，没办法输入标签内容，所以只有属性）

三、css基础

1. css语法：

选择器{属性1: 属性值1; 属性2:属性值2; …}
选择器 - 选中需要添加样式的标签

2. css选择器

a. 元素选择(标签选择) - 将标签作为选择器，选中所有指定的标签
p{} - 选中所有的p标签
a{} - 选择所有的a标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<style>
			p{
				color: red;
				font-size: 30px;
			}
		</style>
		<p>我是段落1</p>
		<a href="">我是超链接1</a>
		<div>我是div1</div>
		<a href="">我是超链接2</a>
		<p>我是段落2</p>
				
	</body>
	
</html>

b. id选择器 - 在id属性值前面加#作为一个选择器，选中id属性值为指定值的标签
每一个可见的标签都可以设置id属性，并且一个页面中，同一个id值只有一个标签。
#p1 - 选中id属性值为p1的标签
#a - 选中id属性值为a的标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<style>
			#p2{
				color: green;
				background-color: yellow;
			}
		</style>
		<p>我是段落1</p>
		<a href="">我是超链接1</a>
		<div>我是div1</div>
		<a href="">我是超链接2</a>
		<p id="p2">我是段落2</p>
	</body>
</html>

c. class选择器 - 在class属性值前加.作为一个选择器，选中class属性值为指定值的标签
不同的标签可以有相同的class值；同一个标签可以有不同的class值。
.c1 - 获取class值为c1的所有标签
p.c1 - 获取class值为c1的p标签
.c1.c2 - 获取class值同时为c1和c2的标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<style>
			.c1{
				color: red;
				font-size: 30px;
			}
			
			.c2{
				background-color: yellow;
			}
			
			p.c1{
				text-decoration: line-through;
			}
			
			.c1.c2{
				border: 1px solid blue;
			}
		</style>
		<p class="c1 c2">我是段落1</p>
		<a class="c2" href="">我是超链接1</a>
		<div>我是div1</div>
		<a class="c1" href="">我是超链接2</a>
		<p id="p2">我是段落2</p>
		<p class="c1">我是段落3</p>
	</body>
</html>

d. 群组选择选择器 - 将多个选择器用逗号隔开作为一个选择器
p,a{} - 选择所有的p标签和所有的a标签
#p1,.c1,p{} - 选择id为p1的标签和class为c1标签以及所有的p标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<style>
			a,p{
				color: red;
				font-size: 30px;
			}
			.c1,a{
				background-color: yellow;
			}
		</style>
		<p class="c1">我是段落1</p>
		<a href="">我是超链接1</a>
		<div>我是div1</div>
		<a href="">我是超链接2</a>
		<p>我是段落2</p>
	</body>
</html>

e. 子代选择器 - 多个选择器用>隔开作为一个选择器
div>p{}
f. 后代选择器 - 多个选择器用空格隔开作为一个选择器
div p{}

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<style>
			p{
				color: red;
			}
			
			div>p{
				font-size: 30px;
			}
			
			div p{
				background-color: yellow;
			}
			
			#box1>div p{
				
			}
		</style>
		
		<p>我是段落1</p>
		
		<div>
			<p>我是段落2</p>
			<span>
				<p>我是段落5</p>
			</span>
		</div>
		
		<div id="box1">
			<p>我是段落3</p>
			<div>
				<span>
					<div>
						<p>我是段落4</p>
					</div>
				</span>
			</div>
			
		</div>
	</body>
</html>