赵广陆

目录1. Vue2 选项式 API vs Vue3 组合式API2. Vue3的优势3 使用create-vue搭建Vue3项目1. 认识create-vue2. 使用create-vue创建项目4 熟悉项目和关键文件5 组合式API - setup选项1. setup选项的写法和执行时机2. setup中写代码的特点3. 语法糖6 组合式API - reactive和ref函数1. reactive2. ref3. reactive 对比 ref

目录1 项目初始化1.1 创建项目1.2 配置 cors 跨域1.3 配置解析表单数据的中间件1.4 初始化路由相关的文件夹1.5 初始化用户路由模块1.6 抽离用户路由模块中的处理函数2 登录注册2.1 新建 ev_users 表2.2 安装并配置 mysql 模块2.3 注册2.4 优化 res.send() 代码2.5 优化表单数据验证2.6 登录2.7 配置解析 Token 的中间件3 个人中心3.1 获取用户的基本信息3.2 更新用户的基本信息

目录1 Node 操作 mysql1.2 操作 mysql 数据库2 Web 开发模式2.1 服务端渲染2.2 前后端分离2.3 如何选择3 身份认证3.1 Session 认证机制3.2 JWT 认证机制

目录1 Express基本使用1.1 托管静态资源2 Express 路由3 Express 中间件3.1 全局中间件3.2 局部中间件3.3 中间件分类4 CORS 跨域资源共享4.1 cors 中间件解决跨域4.2 CORS4.3 CORS 常见响应头4.4 CORS 请求分类

目录1 初识 Nodejs2 Buffer 缓冲区3 fs 文件系统模块3.1 读取文件3.2 写入文件3.3 路径动态拼接问题 `__dirname`3.4 其它操作4 path 路径模块4.1 路径拼接 `path.join()`4.2 获取路径中文件名 `path.basename()`4.3 获取路径中文件扩展名 `path.extname()`5 http 模块5.1 创建基本 Web 服务器5.2 实现简陋路由效果6 模块化6.1 模块化概念

目录1、搜索引擎优化1.1、什么是SEO1.2、搜索引擎工作流程2、服务端渲染和客户端渲染2.1、什么是服务端渲染2.2、什么是客户端渲染2.3、两种方式各有什么优缺点？3、Nuxt.js3.1、Nuxt.js介绍3.2、Nuxt.js服务器端渲染4、Nuxt.js环境初始化4.1、解压4.2、端口修改4.3、安装依赖4.4、运行项目5、页面布局结构5.1、布局组件5.2、布局文件5.3、首页面6、基础路由7、动态路由1、搜索引擎优化1.1、什么是SEO[外链图片转存失败,源站可能有防盗链机制

目录1 前端项目开发流程1.1 项目开发流程1.1.1定义路由模块1.1.2 定义api模块1.1.3 定义页面组件脚本1.1.4 定义页面组件模板1.2项目执行流程1.2.1 页面加载流程1.2.2 页面渲染流程2 分页列表组件2.1 分页查询2.1.1 定义api模块2.1.2、定义页面组件脚本2.1.3、定义页面组件模板2.1.4、改变每页条数2.1.5、翻页2.1.6、序号列2.1.7、查询表单2.2 数据删除2.2.1、定义api模块2.2.2、定义页面组件模板2.2.3、定义页面组件脚本2.3

目录1 JSON2 JSON转换工具的介绍3 JSON转换练习4 小结5 map对象套对象6 JSON时间类型按标准返回1 JSON推荐一个小工具：优快云插件可以将后端返回的json数据进行格式化，而且不容易失效毕竟是csdn维护。JSON: JavaScript Object Notation(JavaScript 对象表示法) JSON 是存储和交换文本信息的语法，类似 XML。JSON 比 XML 更小、更快，更易解析。JSON 指的是 JavaScript 对象表示法（JavaSc

目录1通过 Ajax 完成删除用户2在 Servlet 处理删除用户请求3 运行效果1通过 Ajax 完成删除用户 <script> $(function () { //获取页面初始化数据 getData(); //添加按钮绑定点击事件 $("#add").click(function(){ addOrUpdateUser(...

目录1通过 Ajax 完成预更新用户选择2通过 Ajax 完成更新用户3在 Servlet 中处理更新用户请求4 运行效果1通过 Ajax 完成预更新用户选择 <script> $(function () { //获取页面初始化数据 getData(); //添加按钮绑定点击事件 $("#add").click(function(){ ...

目录1通过 Ajax 完成添加用户2在 Servlet 中处理添加用户请求3 运行效果1通过 Ajax 完成添加用户 <script> $(function () { //获取页面初始化数据 getData(); //添加按钮绑定点击事件 $("#add").click(function(){ addOrUpdateUse...

目录1通过 Ajax 完成页面数据初始化2创建 Servlet 处理页面数据初始化请求3 运行效果1通过 Ajax 完成页面数据初始化 <script> $(function () { //获取页面初始化数据 getData(); //添加按钮绑定点击事件 $("#add").click(function(){ add...

目录1 需求2 创建 User 类3 在页面中创建表格4 运行效果1 需求创建 User 类，包含 uesrid、username、usersex、userbirth 属性。在用户管理页面中通过 Ajax 技术完成对用户数据载入、添加用户、更新用户、删除用户操作。搭建环境 2 创建 User 类public class User { private int userid; private String username; private St

目录1 Ajax 的运行原理2Ajax 简介3 Ajax 的使用3.1 XMLHttpRequest 对象3.2 Ajax 的使用步骤4 实例4.1Jsp页面4.2 Servlet4.3 运行效果1 Ajax 的运行原理2Ajax 简介 Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式、快速动态应用的网页开发技术，无需重新加载整个网页的情况下，能够更新...

目录1 JS 前置知识ECMAScriptBOMJQuery是什么JQuery快速入门JQuery对象和JS原生对象的相互转换入口函数绑定事件遍历的5中方式选择器基本选择器层级选择器属性选择器过滤选择器表单和值选择器DOM操作操作标签内容标签的创建、添加、删除操作标签的样式操作style属性操作class属性操作标签的属性操作原始属性属性操作自定义属性获取表单中用户输入的值设置复选框的选中状态AJAX$.get()方法$.post()方法$.ajax()方法1 JS 前置知识ECMAScript

目录1 学习目标2 axios异步请求2.1 Get请求传参格式2.2 Post请求传参格式3 用户登陆3.1 接口信息3.2 步骤3.3 相关资料3.4 代码4 分页查询4.1 接口信息4.2 效果4.3 步骤4.4 完整js代码5 添加功能5.1 接口信息5.2 效果5.3 思路5.4 相关资料5.5 代码6 编辑功能6.1 接口信息6.2 效果6.3 思路6.4 代码7 删除功能7.1 接口信息7.2 相关资料7.3 思路7.4 代码1 学习目标使用vue+axios+elementUI完成

目录vue2.X介绍快速入门指令介绍文本插值双大括号v-html和v-text条件渲染v-if列表渲染v-for绑定事件v-on注意事项属性绑定v-bind表单绑定v-model单向绑定与双向绑定ElementUI学习目标介绍快速入门Layout 布局Container 布局容器表单vue2.X介绍Vue 是一套构建用户界面的渐进式前端框架。只关注视图层，并且非常容易学习，还可以很方便的与其它库或已有项目整合。通过尽可能简单的 API 来实现响应数据的绑定和组合的视图组件。特点易用：在有

目录1. Nodejs概述2. Nodejs模块化编程3. 创建Nodejs Web服务器4. 处理Nodejs Web请求参数5. 包资源管理器NPM6. 切换NPM镜像7. webpack概述8. webpack打包js9. webpack打包css10. ES6概述&创建测试工程11. let和const命令及模板字符串12. 解构表达式13. 函数优化14. map方法使用15. reduce方法使用16. promise应用示例17. 对象的扩展方法使用18. 数组的扩展方法使用19. 安

目录1. Vue概述2. 搭建示例工程3. 演示双向绑定与事件处理4. Vue实例生命周期及钩子函数5. 插值、v-text和v-html6. 指令-v-model使用7. 指令-v-on使用8. 指令v-for使用9. 指令-v-if和v-show使用10. 指令-v-bind使用11. 计算属性的使用12. watch基本和深度监控13. 组件使用14. 父组件向子组件通信15. 子组件向父组件通信16. axios概述17. axios方法及get、post方法使用1. Vue概述目标：MVV

目录1 显示/隐藏2 淡入/淡出3 向上/向下滑动4 动画5 多个动画设置6 动画队列7 下拉式菜单8 Jquery 的封装原理1 显示/隐藏jQuery有一些易于实现的效果来创建动画。hide()和show()方法用于隐藏和显示所选元素。toggle()方法用于在隐藏和显示元素之间切换。例如：$(function() { $("p").click(function() { $("div").toggle(); });});hi

事件处理jQuery提供了一种处理事件的有效方式。当用户执行操作（例如单击元素，移动鼠标或提交表单）时，会发生事件。当目标元素发生事件时，执行处理函数。例如，假设我们要处理id="demo"的元素上的点击事件，并在点击按钮时显示当前日期。使用纯JavaScript，代码如下：var x = document.getElementById("demo");x.onclick = function () { document.body.innerHTML = Date();}可..

1 文档对象模型DOM当您在浏览器中打开任何网页时，页面的HTML将被加载并在屏幕上可视化呈现。为了实现这一点，浏览器构建了该页面的文档对象模型(DOM)，它是其逻辑结构的面向对象的模型。HTML文档的DOM可以表示为嵌套的一组框：DOM表示文档作为树结构，其中HTML元素是树中的相关节点。节点可以有子节点。同一棵树级别的节点称为兄弟姐妹。jQuery遍历是用于描述移动DOM的过程，并根据其与其他元素的关系来查找（选择）HTML元素的术语。jQuery可以轻松地遍历..

目录1 添加CSS2 删除CSS3 切换CSS4 CSS()方法5 CSS()多属性设置6 带边距的外形尺寸1 添加CSSaddClass()方法为选定的元素添加一个或多个类。例如:HTML:<div>Some text</div>CSS:.header { color: blue; font-size:x-large;}JS:$("div").addClass("header");上面的代码为div元.

1 jQuery属性我们可以通过jQuery轻松的操作分配给HTML元素的属性。比如元素的 href,src,id,class,style 属性。attr()方法用于获取属性的值。例如:HTML:<a href="https://www.youkuaiyun.com/"> 点击这里</a> JavaScript:$(function() { var val = $("a").attr("href"); alert(val);});// 弹出

目录1 jQuery 概述1.1 为什么使用 jQuery2 什么是 jQuery3 jQuery 中$的含义3.1 作用 1：$(function)3.2 作用 2：$(selector)4 选择器学习1 jQuery 概述 1.1 为什么使用 jQuery写最少的代码，办更多的事儿jQuery是一个快速，小巧，功能丰富的JavaScript库。...

目录1 用到的知识1.1 js选择器1.2 循环语句1.3 文档修改语句 1.4 模块移除属性2 HTML代码3 CSS代码3.1 预处理css3.2 jd购物车页面的css4 jd购物车页面的js5 效果展示1 用到的知识前面静态页面知识：HTML+CSS仿京东购物车页面静态页面1.1 js选择器var fav=document....

目录1 操作表单元素1.1 readonly 和 disabled1.2 控制表单提交的方式2 正则表达式3 表单校验1 操作表单元素 1.1 readonly 和 disabled 共同的特点： 可以看到数据， 但是不可以操作数据 不同： readonly（只读）： 里面的数据是可以提交到后台 disabled（不可用）：数据无法提交到后台 使用：...

目录1 获得元素对象的方式(DOM)1.1 直接获得的方式：1.2 间接获得对象的方式：2 操作元素属性2.1 方式一：2.2 方式二：2.3 方式三：3 操作元素样式4 操作元素文本和值5 操作元素1 获得元素对象的方式(DOM) 1.1 直接获得的方式： //获得id名称是div1的对象 var div= document.getElem...

1.13BOM 和 DOM 对象什么是BOM BOM是Browser Object Model的简写，即浏览器对象模型。 BOM由一系列对象组成，是访问、控制、修改浏览器的 属性的方法 BOM没有统一的标准(每种客户端都可以自定标准)。 BOM的顶层是window对象 什么是DOM DOM是Document Object Model的简写，即文档对象模 型。 ...

event 事件 1.什么是事件 事件是可以被 JavaScript 侦测到的行为 网页中的每个元素都可以产生某些可以触发 JavaScript 函数的事件。比方说，我们可以在用户点击某按钮时产生 一个 onClick 事件来触发某个函数 事件通常与函数配合使用，这样就可以通过发生的事件来 驱动函数执行 生活案例： 电动车、汽车报警器 燃气泄漏探测器、火灾烟...

目录1 Date 日期对象2 String 对象学习3 数组的声明方式3.1 数组的使用3.3 数组的遍历3.4 数组中常用的方法1 Date 日期对象 //本月中的第几天 document.write(date.getDate()+"<br />"); //本星期的第几天 document.write(date.getDay()+"<...

Js 的引入方式 <!—[1]JS 引入的方式一--> <script type="text/javascript"> /*网页中的弹框*/ alert("js 的学习课程"); </script> <!--[2]js引入的方式二 type:引入文件的类型 src： 引 入文件的路径 charset:指定引入的编码--&gt...

目录1 JavaScript 的简介1.1 为什么学习 JavaScript1.2 JavaScript 的概念1.3 JavaScript 组成1.4JavaScript 语言的特点1 JavaScript 的简介 1.1 为什么学习 JavaScript1.html+css 只是可以实现静态的页面无法实现动态的效果 2.JavaScript负责网页的行为...

目录1 用到的知识1.1 无序标签的使用1.2 浮动的使用1.3 伪类的使用1.4 清楚原有浮动所占位置1.5 边框背景盒子布局div文字属性等等 2 HTML代码3 CSS代码3.1 预处理css3.2 jd购物车页面的css4.效果展示1 用到的知识1.1 无序标签的使用<ul class="nav_ul2"&g...

目录1 制作动画前的准备知识1.1 CSS3常用属性1.2 CSS3 中的动画标签2 测试代码3 运行效果1 制作动画前的准备知识1.1 CSS3常用属性/*倒圆角指令*/ border-radius: 100px; /* 左上右下 右上左下 */ border-radius:10px 60px; border-radius:10px 20px ...

目录1 CSS3的一些常用的新增选择器1.1获得class名称是div1下面的第一个子元素1.2 获得具体的某一个子元素1.3 获得空的元素对象1.4 获得焦点执行的样式1.5 伪对象选择器是在指定的对象之前（或者之后）插入内容1.6 属性选择器1.7 属性 ^用fom开头的对象2 选择器的种类总结：1 CSS3的一些常用的新增选择器1.1获得class...

目录1 CSS中的定位1.1绝对定位:1.2 相对定位：1.3 固定定位：1.4 默认定位：2 盒子模型2.1 生活中的盒模型2.2 内边距：div和border之间的距离2.3 外边距 ：给盒子进行定位1 CSS中的定位 1.1绝对定位: absolute :定位离开之后释放的之前的位置 基于外层父级标签来说 1.2 相对定位： ...

目录1 CSS字体及文本属性1.1 字体：（font）1.2 文本（text）1.3 border 属性有三个修饰属性1.4 边框的风格2 CSS背景2.1 行高2.2 背景3 CSS 行块儿元素3.1 行元素和块元素4 其他样式1 CSS字体及文本属性1.1 字体：（font） /*字体的颜色*/ color: gray; /*...

常用三种选择器 标签选择器p{ color: red; } id选择器 id:(唯一性) id命名：数字、字母、下划线、中划线（-），不 能用数字开头#p_1{ font-size: 30px; color: yellowgreen; } class选择器.p_2{ font-weight: bold; color: yello...

目录1 CSS介绍1.1 为什么学习 CSS1.2 什么是 CSS2 CSS 的引入的四种方式 ：3 CSS 中三种引入方式遵循的就近原则 ：1 CSS介绍1.1 为什么学习 CSS1.HTML 虽然可以在一定程度上修饰页面，但是页面的整体还是不够美观。 2.HTML 进行网页的书写重复的代码比较多，后期的维护性不好。 1.2 什么是 CSS英文全称：C...