前端三大核心要素以及前后端通讯

1、HTML(结构层)

HTML​(全称:​HyperText Markup Language,即 ​超文本标记语言)是用来构建网页内容和结构的标准标记语言。

简单来说:HTML 就像是网页的骨架或结构,它告诉我们页面上有什么内容:比如标题、段落、图片、链接、列表、表单、按钮等。

2、CSS(表现层)

1、概念:

CSS​(全称:​Cascading Style Sheets,层叠样式表)是用于控制网页外观和布局的一种样式表语言。

简单来说:HTML 负责网页的内容与结构,CSS 负责网页的样式与美观!​

2、CSS缺陷:

1、语法不够强大、无法嵌套使用,模块化开发中需要写很多重复选择器

2、没有变量和复用机制,逻辑相关联的属性值操作必须写大量重复代码,难以维护

3、CSS预处理器

为解决上述缺陷,出现了CSS预处理器

1、概念:

CSS 预处理器​ 是一种工具/语言,它是对原生 CSS 的扩展,提供了更多强大的功能,增加了一些编程的特性,比如:变量(Variables)、 嵌套(Nesting)​混合(Mixins)​函数(Functions)​模块化与导入(Import)、 运算(Operations)​逻辑控制(如 if/for)​

预处理器会将写的这种"增强版 CSS"代码 ​编译(compile)成标准的、浏览器能识别的原生 CSS。

2、常用的CSS预处理器

1、Sass(SCSS):基于Ruby,通过服务端处理,解析效率高,功能强大,但是要学习Ruby语言,官网 :Sass世界上最成熟、稳定和强大的CSS扩展语言 | Sass中文网

2、Less:基于nodeJs,通过客户端处理,使用相对简单;但功能比Sass简单,效率也低于Sass,官网: Less 中文网

3、JavaScript(行为层)

1、概念:

JavaScript(简称 JS)​​ 是一种运行在 ​浏览器中(以及服务器端) 的轻量级、解释型的 编程语言,它是网页的 "动态与交互能力" 的核心。

简单来说: HTML 是网页的骨架,CSS 是网页的皮肤,JavaScript 是让网页动起来、有逻辑、有交互的"大脑"和"肌肉"

2、JavaScript框架
1、jQuery:

优点简化了DOM操作,缺点是DOM操作太频繁,影响前端性能

2、Angular:

Google收购的前端框架,是一群Java程序员开发的,提出了模块化开发理念(MVVM),使用TypeScript语法。

3、React:

Facebook公司发开的,一款高性能的前端框架,提出了虚拟DOM的概念,减少真实DOM的操作,在内存中模拟DOM操作,优点提升了前端渲染效率,缺点使用相对复杂,需要学习JSX语言

4、Vue:

一款渐进式JavaScript框架,综合了Angular模块化开发理念(MVVM)和React的虚拟DOM。

4、Axios(通讯)

Axios​ 是一个基于 ​Promise​ 的 ​HTTP 客户端,用于在浏览器和 Node.js 中发送 异步 HTTP 请求(比如:GET、POST、PUT、DELETE 等)。

简单来说:Axios 是一个 JavaScript 库,用来方便地从浏览器或 Node.js 向服务器发送网络请求并获取数据,例如:获取 API 数据、提交表单、上传文件等

Vue的边界很明显,就是用来处理DOM的,所以并不具备通讯能力

相关推荐
mayaairi9 分钟前
Vue2 事件绑定完全指南:从入门到原理
前端·javascript·vue.js
ℋᙚᵐⁱᒻᵉ鲸落6 小时前
移动端滑动手势冲突:overflow: auto导致外层横向滑动失效
前端·javascript·css·vue.js·html
默_笙7 小时前
🎃 前端学了 Next.js,后端该学啥?NestJS 就是 Node 版的蜜雪冰城
前端·javascript
এ慕ོ冬℘゜9 小时前
navigator 导航对象 BOM制作方法
javascript
慧一居士10 小时前
Vite项目中使用Less步骤,详细使用示例
前端·css
kyriewen11 小时前
面试官让我用 AI 重构一个 8 年陈的 React 组件——他说他不看代码,只看我会不会拆
前端·javascript·面试
Jacky199912 小时前
Electron + Vue 3 桌面打字游戏实战:从 VSCode 扩展到独立应用的架构改造
javascript
xy345313 小时前
Axure9.0 中继器遮罩的核心应用场景(精准适配列表交互)
前端·ui·html·原型·产品设计·axure9.0
柚yuzumi13 小时前
别再猜 this:先看它属于谁,再看它指向谁
前端·javascript
汉堡大王952714 小时前
面试必考:手写代码 new 做了什么?从原理到实现全解析
前端·javascript·面试