自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(26)
  • 收藏
  • 关注

原创 vue-element-admin 换肤功能,登录后不同权限不同皮肤,刷新不会失效

参照ThemePicker组件里的方法,简单修改后编写了一个混入文件 themeMixin.js ,在登录页以及layout/AppMain.vue 引入, 并在created生命周期调用方法 this.handleUserTheme()themeMixin.js下载地址↓提取码:28rf登录页面的使用方式↓mixins: [themeMixin], // 和created同级复制代码将从接口获取到该用户的主题色本地缓存下, 然后调用混入里的方法执行换肤// 主题色缓存。

2023-04-24 10:29:18 256

原创 网页从输入到显示过程

通过域名解析出IP地址以后就要建立TCP/IP连接了

2023-02-10 16:15:23 132

原创 Vuex 的原理

Vuex 的原理

2023-02-08 13:59:34 217

原创 数组有哪几种循环方式

1

2022-09-15 23:32:46 197

原创 常用的数组方法

reverse( )方法将数组中元素的位置颠倒,并返回该数组。该方法会改变原数组。sort( )方法用[原地算法]对数组的元素进行排序,并返回数组。默认排序顺序是在将元素转换为字符串,然后比较它们的UTF-16代码单元值序列时构建的concat( )方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。find( )方法返回数组中满足提供的测试函数的第一个元素的值。否则返回[undefined]findIndex方法返回数组中满足提供的测试函数的

2022-09-15 03:13:04 98

原创 数组方法中哪些会更改原数组,哪些不会更改原数组。

1.不会改变原来数组的有:concat()---连接两个或更多的数组,并返回结果。every()---检测数组元素的每个元素是否都符合条件。some()---检测数组元素中是否有元素符合指定条件。filter()---检测数组元素,并返回符合条件所有元素的数组。indexOf()---搜索数组中的元素,并返回它首次出现的位置。join()---把数组的所有元素放入一个字符串。toString()---把数组转换为字符串,并返回结果。lastIndexOf()---返回一个指定

2022-09-06 00:48:52 2832

原创 JS执行原理,事件循环微任务,宏任务介绍

1.本文重点(一) :微任务、宏任务概念介绍1.微任务与宏任务就属于js代码的范畴 2.js代码主要分为两大类: 同步代码、异步代码 3.异步代码又分为:微任务与宏任务 4.异步任务,又可以细分为宏任务和微任务2.本文重点(二):微任务、宏任务到底谁先执行正确回答:既可以说是先宏后微,也可以说是先微后宏分析:先宏后微 因为:因为js执行的所有都是代码包在 script 标签里面,而 script 本身就是一个异步的宏任务, script 标签执行后,在优先执行 script 标签里面同步

2022-08-13 20:47:26 612

原创 实例成员和动态成员

实例成员,静态成员,原型链

2022-06-20 21:40:24 622

原创 Ajax的用法

1

2022-06-18 20:55:33 69

原创 JavaScript里的 深浅拷贝

JavaScript

2022-06-13 21:21:20 349

原创 JavaScript 构造函数&&数据常用函数

1

2022-06-11 19:33:12 87

原创 Web APIs 日期对象

Web APIs 日期对象

2022-06-08 15:38:22 128 1

原创 Web APIs Dom事件进阶

1

2022-06-01 22:19:04 58

原创 Web APIs 事件

事件是编程语言中的术语,它是用来描述程序的行为或状态的,一旦行为或状态发生改变,便立即调用一个函数。例如:用户使用【鼠标点击】网页中的一个按钮、用户使用【鼠标拖拽】网页中的一张图片<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.

2022-05-31 20:11:15 64

原创 Web APIs DOM 的结构

如下图所示,将 HTML 文档以树状结构直观的表现出来,我们称之为文档树或 DOM 树,文档树直观的体现了标签与标签之间的关系。 获取DOM对象 querySelector 满足条件的第一个元素 ,如果获取不到 返回null querySelectorAll 满足条件的元素集合 返回伪数组有长度和索引号但是没有push等方法,如果获取不到 返回空数组 [] 常用属性修改 直接能过属性名修改,最简洁的语法 <script> // 1. 获取 img.

2022-05-31 20:00:36 69

原创 JavaScript 基础 知道对象数据类型的特征

属性和访问数据描述性的信息称为属性,如人的姓名、身高、年龄、性别等,一般是名词性的。 属性都是成 对出现的,包括属性名和值,它们之间使用英文 : 分隔 多个属性之间使用英文 , 分隔 属性就是依附在对象上的变量 属性名可以使用 "" 或 '', <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JavaSc

2022-05-31 19:47:46 67

原创 JavaScript 基础 函数

形参和实参形参:声明函数时写在函数名右边小括号里的叫形参(形式上的参数)实参:调用函数时写在函数名右边小括号里的叫实参(实际上的参数)形参可以理解为是在这个函数内声明的变量(比如 num1 = 10)实参可以理解为是给这个变量赋值开发中尽量保持形参和实参个数一致返回值函数的本质是封装(包裹),函数体内的逻辑执行完毕后,函数外部如何获得函数内部的执行结果呢?要想获得函数内部逻辑的执行结果,需要通过 return 这个关键字,将内部执行结果传递到函数外部,这个被传递到外部的结果就...

2022-05-26 21:51:11 107 1

原创 JavaScript for循环

for语句的基本使用1.<script> // 1. continue for (let i = 1; i <= 5; i++) { if (i === 3) { continue // 结束本次循环,继续下一次循环 } console.log(i) } // 2. break for (let i = 1; i <= 5; i++) { if

2022-05-24 21:38:34 2471 1

原创 JavaScript 基本的流程控制

if 多分支和switch的区别if 多分支语句和 switch的区别: 共同点: 都能实现多分支选择, 多选1 大部分情况下可以互换 区别: switch…case语句通常处理case为比较确定值的情况,而if…else…语句更加灵活,通常用于范围判断(大于,等于某个范围)。 switch 语句进行判断后直接执行到程序的语句,效率更高,而if…else语句有几种判断条件,就得判断多少次 switch 一...

2022-05-23 18:34:44 149 1

原创 JavaScript介绍

JavaScript是什么?JavaScript是一种运行在客户端(浏览器)的编程语言,实现人机交互效果JavaScript作用JavaScript作用:确定网页的行为交互(教网页做事情)JavaScript组成ECMAScript DOMBOMJavaScript书写位置内部样式(内嵌式):通过 script 标签包裹 JavaScript 代码外部样式:一般将 JavaScript 代码写在独立的以 .js 结尾的文件中,然后通过 scri...

2022-05-21 21:18:58 615

原创 媒体查询和栅格系统使用

媒体查询的目的:了解如何使用媒体查询做响应式页面。媒体查询会写如下代码即可:body { background-color: gray;}/* 大于等于768px 为粉色 */@media (min-width: 768px) { body { background-color: pink; }}/* 大于等于992px 为蓝色 */@media (min-width: 992px) { body { backgrou

2022-05-19 21:47:46 367 1

原创 移动端的适配

移动端的一般采用flex布局+rem单位来做。flex + viewport width /vh单位 做适配效果 (马上的一个趋势 )让flex做布局(盒子摆放),让rem或者vw/vh 实现网页元素的尺寸(宽度和高度)适配屏幕rem 单位rem 是一个相对单位,1rem 就是 html 文字的大小 例:则此时 1rem 就是 35像素。html { font-size: 35px;}媒体查询(了解)媒体查询一个非常大的作用是:根据屏幕宽度修改html文字大小。.

2022-05-16 20:51:12 342 1

原创 flex布局改变主轴方向用法

设置主轴方向主轴默认是水平方向, 侧轴默认是垂直方向修改主轴方向属性: flex-direction语法:flex-direction:column;修改完毕,主轴是Y轴, 侧轴是X轴。属性值 作用 row 行, 水平(默认值) column *列, 垂直 row-reverse 行, 从右向左 column-reverse 列, 从下向上 弹性盒子换行特性: 给父亲添加了 display: flex; 所有的子盒子(弹性盒子

2022-05-15 20:32:02 2838 1

原创 移动端特点

PC端/移动端不同?PC端 屏幕大,网页固定版心 端浏览器繁多,更多考虑兼容性问题。(布局: 浮动+定位+标准流) 移动端 手机屏幕小,网页宽度多数为100%,是适配手机屏幕宽度 移动端则基本不需要考虑兼容性问题,放心大胆使用CSS新特性 物理分辨率和逻辑分辨率 物理分辨率:硬件所支持的,屏幕出厂就设定无法修改 逻辑分辨率:软件可以达到的, 我们开发中写的是逻辑分辨率 视口视口(viewport)就是浏览器显示页面内容的屏幕区域。视口的

2022-05-14 21:08:56 131 1

原创 HTML里关于空间转换3D和动画效果的实现

HTML里关于空间转换3D和动画效果的实现

2022-05-12 20:23:05 307 1

原创 使用字体图标和transform等

transform:变形 、转换rotate:旋转 案例transfom:rotade(180deg) 或者1(turn) 1(turn)=360(deg)=转了一圈skew:倾斜scale:缩放1.关于字体图标的具体步骤1选择图标库,2选择图标,3加入购物车,4在购物车里添加至选项,5下载至本地2.引入相关文件 复制到Fonts文件夹里面,引入CSS<link rel="stylesheet" href="./fonts/iconfont.css">3.使用类名引入字体

2022-05-11 21:45:58 353 2

所有面试题.md

所有面试题.md

2022-08-19

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除