前端HTML、CSS、JS、VUE 汇总

前言

提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加

使用VS Code运行前端代码

在VS Code上安装前端插件
正在更新中~ ✨


文章目录


提示:这里可以添加本文要记录的大概内容:

HTML+CSS

学习 https://developer.mozilla.org/zh-CN/docs/Learn/CSS

学习路线 知识定位
HTML基础 标签、表格、表单、按钮、div、单元格合并
CSS基础 基本语法、选择器、使用方式、优先级、层叠样式、继承特性
CSS常用样式 字体样式、文本样式、列表样式、背景样式、鼠标样式、伪类样式、设置透明度
CSS 内容盒子与边框盒子 边框、内边距与外边距
CSS+HTML实现元素定位 相对定位、绝对定位、固定定位、z-index样式、数量角标、透明度
❗CSS 弹性布局 justify-content 主轴排列方式、align-itemsalign-content 侧轴排列方式

JS

推荐学习视频

学习路线 知识定位
JavaScript(JS基础) js编写方式、js基本写法、数据类型,===== 、流程控制语句
JS中的函数与数组 函数定义与调用、函数参数与返回值、letvar关键字使用、数组创建及使用
JS中常用内置对象 数组常用方法❗、字符串常用方法、数学对象常用方法、全局对象方法Global
BOM模型 window对象常用方法、location 地址栏对象、history 对象
DOM模型 获取DOM对象常用方法、获取DOM对象时机、操作DOM属性、常用DOM对象属性、遍历DOM数组
DOM编程事件与简单编程 事件绑定、DOM编程应用
JSON轻量级数据交换格式 前后端数据交换格式比较、JavaScript自定义对象
jQuery从入门到应用:选择器、DOM与Ajax综合指南 jQuery对象(jQuery的使用、jQuery包装集与Dom对象)、jQuery选择器(基础、层次、表单选择器)、Dom操作(增加、删除、遍历元素)、jQuery事件(ready加载事件、绑定事件、jQuery的.click())、Ajax(原生Ajax的实现流程、Ajax使用)

Vue2

推荐学习视频1推荐学习视频2

学习路线 知识定位
Vue2 属性绑定 v-bind 属性绑定 v-bind
Vue2 事件绑定 @ 单击事件 (click) 、双击事件 (dblclick)、内容改变事件 (change)、键盘按下事件 (keydown) 、键盘抬起事件 (keyup) 、鼠标移入事件 (mouseenter) 和移出事件 (mouseleave)、表单事件:获取焦点 (focus) 和失去焦点 (blur) 、组合事件示例
Vue2 使用 v-if、v-else、v-else-if、v-show 以及 v-has 自定义指令实现条件渲染 v-if 的基础用法、v-elsev-else-ifv-showv-if 对比、自定义指令 v-hasv-ifv-has 结合使用场景
Vue2 双向绑定 v-model v-model 双向绑定
Vue2 列表渲染 基本数组渲染、对象属性渲染、表格数据渲染、动态表单生成、级联选择器、数据更新视图不刷新、动态过滤/排序、空状态处理
Vue2 过滤器 Filters 过滤器的核心特性、过滤器的常见使用场景、案例
Vue2 监听器 watcher 监听器的作用、工作流程、基本用法、使用场景、关键配置项、与计算属性的区别、动态添加监听器、注意事项
Vue2 生命周期 Vue2 生命周期流程(8个核心钩子)
Vue2 组件创建与使用 组件的创建与使用(组件的定义、子组件的注册与使用、组件通信Mixins 复用逻辑、动态组件与条件渲染、第三方组件库)、第三方组件库与私有组件的区别(定义组件、注册组件、Props 数据传递、自定义事件通信、插槽(Slots))
Vue2 组件切换方式 使用 v-if 和 v-else 实现组件切换、:is 实现组件切换
Vue2 父子组件数据传递与调用:从 ref 到 $emit 父组件向子组件传递数据的方式、父组件调用子组件方法的方式、子组件向父组件传递数据的方式、流程示意图
Vue2 插槽 Slot 在组件中定义插槽(子组件视角)、使用插槽(父组件视角)、插槽与 Props 的对比

Vue3

推荐学习视频

Vue.js - 渐进式 JavaScript 框架 | Vue.js

学习路线 知识定位
vue3 基本语法 MVVM框架、文本渲染指令 v-text、属性绑定指令、事件绑定 @事件名、❗条件渲染指令、循环遍历指令
Vue3 创建 Vue-Cli脚手架创建、vite 创建
Vue3 组合式API Vue2Vue3区别、ref 对比 reactive
Vue3 setup 语法糖 setup 语法糖
Vue计算属性与监听器 计算属性配置项 computed、监听器配置项 watch
v-model双向绑定指令 v-model.lazy 延迟同步、v-model.trim 去掉空格
❗Vue生命周期 钩子函数
Vue3 路由 命名路由、嵌套路由、路由传参、路由导航
Vuex 使用 state 配置项、getters 配置项、mutations 配置项、actions 配置项
Pinia 状态管理库 了解 Pinia
AJAX与axios框架 跨域访问
Vue 组件化开发 父子组件相互传数据、插槽 slot
相关推荐
傻乐u兔4 小时前
C语言进阶————指针4
c语言·开发语言
大模型玩家七七4 小时前
基于语义切分 vs 基于结构切分的实际差异
java·开发语言·数据库·安全·batch
历程里程碑4 小时前
Linux22 文件系统
linux·运维·c语言·开发语言·数据结构·c++·算法
恋猫de小郭4 小时前
Flutter Zero 是什么?它的出现有什么意义?为什么你需要了解下?
android·前端·flutter
牛奔5 小时前
Go 如何避免频繁抢占?
开发语言·后端·golang
寻星探路9 小时前
【深度长文】万字攻克网络原理:从 HTTP 报文解构到 HTTPS 终极加密逻辑
java·开发语言·网络·python·http·ai·https
崔庆才丨静觅10 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
lly20240610 小时前
Bootstrap 警告框
开发语言
2601_9491465311 小时前
C语言语音通知接口接入教程:如何使用C语言直接调用语音预警API
c语言·开发语言
曹牧11 小时前
Spring Boot:如何测试Java Controller中的POST请求?
java·开发语言