Python之前端的学习

 前端学哪些内容


1. HTML    # 网页的骨架、只是负责显示一些内容,但是显示出来的内容不好看,没样式
2. CSS  # 对网页骨架的美化、让网页变得更加的好看而已
3. JavaScript # html、css都是不能动的,静态的,js就是让网页能够动起来,变得更加的美观
4. bootstrap、jQuery
称为是前端的三剑客!
学习一些前端配套的框架(库): bootstrap、jQuery、vue、react、angular.js
网址栏中输入地址回车,到看到页面的返回,整个过程发生了什么事?
1. 客户端输入网址向服务端发起请求
2. 服务端收到客户端的请求,处理请求
3. 服务端要给客户端做出响应
4. 把服务端返回的内容渲染(显示)到浏览器页面中
# 我们学习前端谁来翻译前端的代码? 浏览器(就是前端代码的执行环境)
学习前端只需有一个浏览器即可,浏览器就是前端的解释器
 
# 浏览器就是一个万能的客户端,超级客户端,言外之意,他可以作为很多服务端的客户端
比如:淘宝、腾讯视频、京东、等
"""我们自己能不能开发一个B/S架构的软件,能."""
开发一个服务端即可,浏览器已经存在了,让浏览器作为我们的客户端,你会写服务端吗?
利用socket写一个服务端,让浏览器作为我们的客户端
 
你说浏览器它是很多服务端的客户端,问题是:浏览器是怎么识别是哪个服务端的?
很多服务端必须都要遵循浏览器的规则,所以,浏览器才能够正常的识别他们(数据传出的规则)
这个规则是:协议(HTTP协议)
 
HTTP协议在那一层起的作用?
HTTP协议:最上层:应用层
TCP/UDP: 传输层
ip协议: 网络层

HTTP协议


HTTP协议的四大特性
    1. 基于请求和响应的(有请求,有响应)
    2. 它是基于TCP协议之上的应用层协议
    3. 无状态
         就是这个协议它不能够在浏览器中保存数据,现在使用的:淘宝、支付宝、京东等这些网站都需要登录
          cookie、session、token、jwt等保存的,他们才是真正的保存用户数据的
   4. 短链接
      # 长链接
    
请求数据
    请求首行(请求方式、协议和版本号)
    请求头(一大堆的k:v的键值对)
    
    换行符(\r\n)
    
响应数据
    响应首行(响应状态码)
    响应头(一大堆的k:v的键值对)
    
    换行符(\r\n)
 
请求方式:
    # 有很多种:现在你需要掌握2种
    get
        """当朝服务端索要数据的时候,一般使用get请求方式"""
        https://huodong.taobao.com/wow/a/act/tao/dailyact/4634/wupr?spm=a21bo.jianhua.201867-main.1.5af92a89NWpkvM&wh_pid=dailyAct-257518
        
        https://huodong.taobao.com/index/v1/?k=v&k1=v1&k2=v2
        https://huodong.taobao.com/func
        def index()
            # 需要参数?
        def func()
        
        
    post
        """当朝服务端提交数据的时候,一般采用post请求"""
        post请求,参数在哪里传递?
   面试题:get和post的区别?
        1. get:
            索要数据的时候使用
            传参方式:在网址栏的问号后面:key=value的键值对方式
            数据传递不安全
            数据传递的时候,携带的数据量是有限制的,大概4KB左右的数据
         2.post:
            提交数据的时候使用
            在请求体里面
            数据传递更加安全
            数据传递没有限制,想传多少传多少
            
 响应状态码:
    """使用一个特殊的数字代表一串复杂的描述性信息"""
    1xx: 代表的是请求数据成功,但是这个时候还可以继续往服务端提交数据
    2xx: 200 OK 代表的是请求成功
    3xx:301 302 代表的是重定向
    4xx: 404 Not Found 代表的是资源找不到
    5xx:500 502 服务器内部错误(出现网页打不开的情况)
    
面试题:请说出常见的响应状态码(1xx 2xx 3xx 301 201)
业务状态码HTML介绍
你在网页中所能够看到的花里胡哨的东西都是HTML标签
<h1>hello python</h1>
<h5>hello python</h5>
<a href='http://baidu.com'>click me</a>
<img src=''>
学习前端在哪里写前端代码
1. pycharm
2. 直接在浏览器中写
3. 直接在txt文本也可以
4. vscode


HTML文档介绍

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title></head>
<body></body>
</html>
<head> 标签里面写的内容一般不是让用户看的,给程序员看的
<body> 标签才是用户看的,在body里面写什么,浏览器就显示什么,head里面写的代码是对body中的代码做控制


 

如何打开一个HTML文档


1. 直接点击pycahrm右上角的浏览器图标
2. 直接找到文档所在的位置,右键选择使用浏览器打开即可
"""浏览器就是前端的解释器,所有的前端代码都是有浏览器来翻译的"""

head中的常用标签<title>Title</title> 就是浏览器标签页上显示的内容<title>Title</title>
<!--    <style>-->
<!--        /*写css样式的*/-->
<!--        a {-->
<!--            color:  red;-->
<!--        }-->
<!--    </style>--><link rel="stylesheet" href="my.css">
<!--    <script>-->
<!--        alert(123)-->
<!--    </script>--><script src="my.js"></script>
body中的常用标签
# 基本标签:<b>加粗</b><i>斜体</i><u>下划线</u><s>删除</s><p>段落标签</p><h1>标题1</h1><h2>标题2</h2><h3>标题3</h3><h4>标题4</h4><h5>标题5</h5><h6>标题6</h6><!--换行--><br><!--水平线--><hr>
# 特殊字符内容    对应代码空格    &nbsp;>    &gt;<    &lt;&    &amp;¥    &yen;版权    &copy;注册    &reg;


 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/121913.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LabVIEW开发TDS1000 和TDS2000 系列泰克示波器

LabVIEW开发TDS1000 和TDS2000 系列泰克示波器 泰克示波器是经常用到的工具&#xff0c;一般手动操作即可&#xff0c;但有时候也要集成到系统中&#xff0c;需要程控。这时候先要下载厂家提供的例子&#xff0c;了解LabVIEW的demo。根据不用的示波器型号&#xff0c;选择和计…

【Proteus仿真】【Arduino单片机】直流电机和步进电机

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真Arduino单片机控制器&#xff0c;使用蜂鸣器、按键、直流电机、步进电机、ULN2003、L293D等。 主要功能&#xff1a; 系统运行后&#xff0c;K3键启动运行&#xff0c;K1和K2键控制…

.net 7 上传文件踩坑

(Name “file”) 没加上这个传不进文件 /// <summary>/// 上传单个文件/// </summary>/// <param name"formFile"></param>/// <returns></returns>[HttpPost("UploadFiles")][FunctionAttribute(MuType.Btn, "…

MAC安装stable diffusion

./webui.sh --precision full --no-half-vae --disable-nan-check --api Command: "/Users/xxxx/aigc/stable-diffusion-webui/venv/bin/python3" -m pip install torch2.0.1 torchvision0.15.2 Error code: 2 执行命令&#xff1a; pip install torch2.0.1 torchvi…

MATLAB R2023b安装包下载链接

MATLAB2023b下载链接&#xff1a; 链接&#xff1a;https://pan.baidu.com/s/15VgPf8GnxlZHcbh2grJrDQ?pwdluob 提取码&#xff1a;luob

【LeetCode力扣】189 53 轮转数组 | 最大子数组和

目录 1、189. 轮转数组 1.1、题目介绍 1.2、解题思路 2、53. 最大子数组和 2.1、题目介绍 2.2、解题思路 1、189. 轮转数组 1.1、题目介绍 原题链接&#xff1a;189. 轮转数组 - 力扣&#xff08;LeetCode&#xff09; ​ 示例 1: 输入: nums [1,2,3,4,5,6,7], k 3输…

java原子类-Atomic

什么是原子类&#xff1f; java 1.5引进原子类&#xff0c;具体在java.util.concurrent.atomic包下&#xff0c;atomic包里面一共提供了13个类&#xff0c;分为4种类型&#xff0c;分别是&#xff1a; 原子更新基本类型&#xff0c;原子更新数组&#xff0c;原子更新引用&…

一次js请求一般情况下有哪些地方会有缓存处理

目录 前言 1. 浏览器缓存 1.1 强缓存 用法 代码 理解 1.2 协商缓存 用法 代码 理解 2. 服务端缓存 2.1 反向代理缓存 用法 代码 理解 2.2 应用层缓存 用法 代码 理解 3. CDN缓存 3.1 用法 3.2 理解 4. DNS缓存 4.1 用法 4.2 理解 5. AJAX请求缓存 5.…

【网络安全 --- 任意文件下载漏洞(1)】任意文件下载漏洞

一&#xff0c;环境&#xff0c;工具准备 1-1 VMVare 16 虚拟机及下载安装&#xff08;资源&#xff09; 请参考以下博客安装&#xff08;特详细&#xff09;&#xff1a;【网络安全 --- 工具安装】VMware 16.0 详细安装过程&#xff08;提供资源&#xff09;-CSDN博客【网络安…

Linux ln命令:建立链接文件

如果要想说清楚 ln 命令&#xff0c;则必须先解释下 ext 文件系统&#xff08;Linux 文件系统&#xff09;是如何工作的。我们在前面讲解了分区的格式化就是写入文件系统&#xff0c;而我们的 Linux 目前使用的是 ext4 文件系统。如果用一张示意图来描述 ext4 文件系统。 ext4 …

解决eslint与prettier在代码格式上的冲突

eslint与prettier在代码格式上的冲突 因为eslint本身也具备对代码格式的控制与检查能力&#xff0c;所以不可避免可能会与prettier的代码格式冲突&#xff0c;比如eslint配置rules中对缩进的要求为2并在不满足时报错。 解决方案很简单——思路就是把prettier的规则复写进esli…

无需编程,小白也能建立个人网站

想要搭建一个属于自己的网站&#xff0c;但又不懂编程&#xff1f;别担心&#xff0c;现在有一个简单的方法可以帮助你轻松实现这个愿望。只需要几个简单的步骤&#xff0c;就可以让小白也能搭建出一个漂亮的网站。 首先&#xff0c;登录乔拓云账号&#xff0c;点击网站搭建进入…

2-多媒体数据压缩国际标准

文章目录 多媒体数据压缩编码的重要性和分类为什么要压缩?计算: 未压缩音频的数据率简答: 环绕声系统-作业题9(简述7.4.3全景声)计算: 未压缩图像的数据量-作业题10(估计尺寸及容量)计算: 未压缩视频的数据率 为什么能压缩?数据压缩编码的两大类无损压缩算法: LZ77-作业题6-(…

大数据Doris(十三):创建用户和创建数据库并赋予权限

文章目录 创建用户和创建数据库并赋予权限 一、创建用户

css-渐变色矩形

效果图&#xff1a; 代码&#xff1a; html: <!DOCTYPE html> <html><head><meta charset"utf-8"><meta name"viewport" content"initial-scale1.0, user-scalableno" /><title></title><link …

c++复合数据类型

文章目录 复合数据类型数组 复合数据类型 数组 数据类型 数组名[元素个数] #include<iostream>using namespace std;int main() {const int n 3;// 元素个数必须为常量double ls[n];//初始化int ls1[2] {1, 2};float ls2[] {1.2, 3.1, 5.2, 6.6};short ls3[5] {3,…

【多线程面试题 六】、 如何实现线程同步?

文章底部有个人公众号&#xff1a;热爱技术的小郑。主要分享开发知识、学习资料、毕业设计指导等。有兴趣的可以关注一下。为何分享&#xff1f; 踩过的坑没必要让别人在再踩&#xff0c;自己复盘也能加深记忆。利己利人、所谓双赢。 面试官&#xff1a; 如何实现线程同步&…

吃豆人C语言开发—Day2 需求分析 流程图 原型图

目录 需求分析 流程图 原型图 主菜单&#xff1a; 设置界面&#xff1a; 地图选择&#xff1a; 游戏界面&#xff1a; 收集完成提示&#xff1a; 游戏胜利界面&#xff1a; 游戏失败界面 死亡提示&#xff1a; 这个项目是我和朋友们一起开发的&#xff0c;在此声明一下…

MFC知识点

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、pandas是什么&#xff1f;二、使用步骤 1.引入库2.读入数据总结 前言 提示&#xff1a;这里可以添加本文要记录的大概内容&#xff1a; 例如&#xff1a;…

Linux cp命令:复制文件和目录

cp 命令&#xff0c;主要用来复制文件和目录&#xff0c;同时借助某些选项&#xff0c;还可以实现复制整个目录&#xff0c;以及比对两文件的新旧而予以升级等功能。 cp 命令的基本格式如下&#xff1a; [rootlocalhost ~]# cp [选项] 源文件 目标文件 选项&#xff1a; -a&…