前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >一个请求的组成、静态页面和动态页面、HTML, CSS和JS、浏览器渲染的过程

一个请求的组成、静态页面和动态页面、HTML, CSS和JS、浏览器渲染的过程

作者头像
友儿
发布2022-10-05 08:09:49
1.5K0
发布2022-10-05 08:09:49
举报
文章被收录于专栏:友儿

一个请求的组成

代码语言:javascript
复制
def request_jd(keyword):
    url = "https://search.jd.com/Search"
    params = {
        "keyword": keyword
    }
    headers = {
        "user-agent": "Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.141 Safari/537.36"
    }
    response = requests.get(url=url, params=params, headers=headers)
    response.text  获取str类型的响应内容
    response.content 获取bytes类型的响应内容
    response.json() 获取json格式数据

请求行(request line)

  • URL
  • 请求方法(method)

请求头(headers)

  • user-agent 用来指示当前请求时从哪个终端发起的
  • cookie 用来指示当前的用户信息和行为信息

请求体(body)

params(严格来说不算是请求体)

实际请求的时候会变成URL的一部分, 所以说post请求也可以用params

urlencode和urldecode

请求头中指定的编码格式只对请求体是有效的, 不对params有效. 所以urlencode来保证URL不会发生编码问题.

代码语言:javascript
复制
from urllib.parse import quote, unquote

print(quote("鼠标"))
print(unquote("%E9%BC%A0%E6%A0%87"))

data

携带额外的请求信息.

静态页面和动态页面

静态页面

纯粹的HTML文件, 简单地说当前的页面文件就存储在服务端, 我们请求的静态页面实际上就是请求对方服务器中的文件. 通过返回不同的HTML文件来完成不同请求的显示效果.

  • 动态页面和静态页面的区分绝不是指页面上的动画效果

最常见的就是各大企业网站

动态页面

动态页面是指除了HTML以外, 通过ajax在不直接刷新页面的前提下, 完成了和服务端的数据交互. 并通过javascript回调函数完成对页面内容的修改, ajax和服务端交互的数据格式通常为json

浏览商品 视频网站的瀑布流

Ajax

asynchronous JavaScript-XML 异步javascript和xml的缩写

在不直接刷新页面的前提下, 完成了和服务端的数据交互. 并通过javascript回调函数完成对页面内容的修改, ajax和服务端交互的数据格式通常为json.

json

js对象标记法, 用来表示对象关系

js中的对象: {a: 1, b: null}

  • json的作用 是一种跨平台跨语言的传输对象格式, 可以保留一些基础的数据类型信息. 原来json只是作为前端和服务端传输数据的格式规范, 但是现在几乎所有热门语言都内置了json, 所以可以称之为跨语言的传输格式
代码语言:javascript
复制
import json

test_dict = {
    "a": 1,
    "b": ["1", 2, None],
    "c": {"d": 1}
}

# json格式数据其实是个字符串
# 将python字典转变为json数据格式
json_data = json.dumps(test_dict)
print(type(json_data), json_data)

# 将json数据格式转变为字典
print(json.loads(json_data))

HTML, CSS和JS

html和js决定了显示的内容, css决定了怎么显示.

HTML(HyperTextMarkup Language 超文本标记语言)

HTML的作用

定义网页的内容的含义和结构.

tag(标签)

<标签名>

<html>

表示当前是一个HTML文档对象

<head>

提供一些基础信息

代码语言:javascript
复制
# 通过meta标签来表示当前页面的编码格式
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<body>

纯内容

element(元素)

<标签名> xxxxxxxxxx</标签名>

CSS(Cascading Style Sheets 层叠样式表)

能对网页中的元素位置的排版进行像素级别的控制. 页面的渲染主要就是通过css来完成的.

JavaScript

通过<script></script>包裹, 主要完成数据的交互和对DOM树(HTML是一个结构化的数据文件, DOM就是将结构化的数据转变成对象)的修改.

浏览器渲染的过程

  • 接收到HTML文件后开始构建DOM(Doucment Object Model)树.
  • CSS来计算DOM树各个节点的坐标, 大小等CSS属性, 开始布局.
  • 开始加载媒体资源和页面渲染.
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

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

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

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一个请求的组成
  • 静态页面和动态页面
  • HTML, CSS和JS
  • 浏览器渲染的过程
相关产品与服务
云服务器
云服务器(Cloud Virtual Machine,CVM)提供安全可靠的弹性计算服务。 您可以实时扩展或缩减计算资源,适应变化的业务需求,并只需按实际使用的资源计费。使用 CVM 可以极大降低您的软硬件采购成本,简化 IT 运维工作。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档