- 博客(220)
- 收藏
- 关注
RSS订阅原创 判断两个对象（注意特殊对象的处理）找出不一致的是哪个变量，返回的格式类似：“root变量-父变量-...-不一致的变量“的字符串；
在看到这个题目的时候自己本来的想法是遍历这个对象中的所有的属性，逐一对比，打印出对象不同的属性：后来发现这样确实是可以找出不同的属性，但是并没有达到题目要求的输出效果， 附上代码 function diff(oldstu, newstu) { let str = []; for (const key in oldstu) { if (oldstu.hasOwnProperty(key)) { if (oldstu[key] &
2021-03-11 21:19:47
286
原创 微信小程序自定义组件及父子组件之间的传值
自定义组件component创建使用组件的步骤。在组件的json文件中更改 “component”: true。在使用组件的页面中声明所用组件的名称和路径。组件构造器主要定义组件，调用 Component 构造器时可以指定组件的属性、数据、方法……主要在lifetimes中进行生命周期函数的不同阶段的使用。attached: function () { },//在组件实例进入页面节点树时执行moved: function () { },//在组件实例被移动到节点树另一个位置时执行deta
2021-02-19 17:15:47
583
原创 Tcp滑动窗口协议简介
窗口机制 固定窗口(存在问题) 固定值太小：每次传输都要确认，不停的确认，造成很大的延迟 固定值太大：假如处理方处理不过来的话，每次传过来的还是相同的值，造成链路拥塞。 滑动窗口---流量控制 提供tcp的可靠性 提供tcp的流控特性 tips:描述接受方数据报缓存区的大小，发送方根据这个大小来确认发送多少数据。面向流的可靠性传输----->>确认重传机制发送窗口只有收到对端对于本段窗口字节的ACK确认才
2021-02-19 15:34:01
755
原创 找出数组中元素出现次数超过数组长度一半的元素
题目：数组中有一个数字出现的次数超过数组长度的一半，请找出这个数字。例如输入一个长度为9的数组{1,2,3,2,2,2,5,4,2}。由于数字2在数组中出现了5次，超过数组长度的一半，因此输出2。如果不存在则输出0。这道题有多种解法，下面主要说两种。常规方法：创建一个Map，遍历数组中的元素，如果元素不在map中出现过，将元素设置为key，value=1，如果元素在map中，就取出这个元素，并将对应的value值+1.最后遍历map中的元素，如果有value>数组长度的一半，就返回值 思维方
2020-12-26 20:51:36
897
2
原创 Vue响应式原理
目录vue中的数据发生改变的时候，模板对应的值也会改变，渲染成新的数据在Vue中通过Object.defineProperty 监听数据的变化，Object.defineProperty(obj, prop, descriptor)当新建一个Vue对象的时候，把data中的数据挂载到Vue中，遍历循环数据，用defineProperty 方法监听对象属性的变化，defineProperty 中有get和set方法Object.keys(obj).forEach(key =>.
2020-11-16 21:13:35
156
原创 Vue以插件的方式封装一个组件
基本思想：步骤创建一个vue文件，写入想要封装的组件（这里以toast弹出框为例），调整组件样式<template > <div class="toast"> <div>{{message}}</div> </div></template><script>export default { name:"Toast", data() { return { me.
2020-11-13 10:47:10
471
原创 ECharts
初次接触ECharts,简单使用安装cnpm install echarts --save在main.js中引入并且挂载在DOM上import echarts from "echarts";Vue.prototype.$echarts = echarts;创建放ECharts的容器<div id="main" ref="chart"></div>调用方法写ECharts中格式数据 drawChart() { var
2020-10-26 22:01:26
268
原创 前端结合elementui实现分页功能
在elementUI中使用table组件完成页面的大概框架，并且使用Pagination分页组件---tips：这里不是重点，不做过多阐述步骤：通过Axios把数据全部渲染到页面上
2020-10-22 22:05:23
2466
原创 Vue结合uni-app实现手机端的扫码功能
uniApp二维码文档地址：https://www.html5plus.org/doc/zh_cn/barcode.html步骤：组件中创建div容纳扫码控件 创建扫描控件 开始扫描 关闭扫描 关闭条码识别控件tips：在代码中，我是在mounted函数中就调用了startRecognize()函数，创建了扫码识别控件，为了便于演示，大家可以在页面上加几个按钮，绑定不同的函数调用创建，开始，关闭扫描控件函数其中startRecognize()函数中的result值就是扫码的结果，可
2020-10-21 21:55:10
3495
6
原创 vue实现动态二维码完成签到功能
最近在项目中通过前端生成的动态二维码完成签到功能下面使整体项目的逻辑思路：动态的生成二维码并且获取当前的时间戳，通过扫码比对时间戳过后确定是否签到成功。步骤 使用npm安装qrCodejs2-在所需的页面导入 npm install qrcodejs2 写一个div容器用于生成二维码的存放 <div class="qrcode" ref="qrCodeUrl"></div> 在页面中生成二维码，通过开启关闭定时器刷新二维码实现动..
2020-10-21 21:42:17
6393
1
原创 解决element-ui中导航栏常亮不跟随页面路由
在项目中使用elementui框架中的路由。其中default-active控制导航栏栏目是否跟随页面亮。解决：将default-active绑定自定义的path值，在方法中通过this.$route.path获取当前页面的路由，比对当前页面的路由和获取的路由是否相同，如果不相同，则跳转到指定的路由。created() { this.path =this.$route.path } changeA(indexX){ if(this.$route.path !==ind
2020-10-21 20:56:39
907
原创 解决vue给组件绑定click单击事件不生效，分析click中的事件
在vue的使用中会出现给组件绑定click事件不执行的情况。给vue组件绑定事件的时候必须加上.native（监听根元素的原生事件，使用.native修饰符）这个操作等同于子组件内部处理click事件然后向外发送click事件：$emit("click".fn)在vue中使用click.stop可以阻止单击事件冒泡使用click.prevent可以使得提交事件不再重载页面<!-- 阻止单击事件冒泡 --><a v-on:click.stop="doThi...
2020-10-21 20:46:37
3744
原创 关于localStorage与sessionStorage的区别与使用
目录关于localStorage与sessionStorage的区别与使用介绍主要区别相同之处：使用Web Storage的一些优点：使用方法：项目中的实际应用1.结合localStorage实现路由守卫，用户实现一次登录即可2.结合sessionStorage实现用户在一次会话中保存数据，实现页面的二级密码关于localStorage与sessionStorage的区别与使用介绍在Html5主要更新两个与本地储存相关的的内容：Web Storage.
2020-10-21 20:30:17
1347
原创 find和findIndex的区别
以下是模拟在array中加一个find的源码var users = [ {id:1,name:'l'}, {id:2,name:'l'}, {id:3,name:'s'}, {id:4,name:'l'}]Array.prototype.myFind = function(conditionFunc){ for(var i = i;i<this.length;i++){ if(conditionFunc(this[i],i)){ .
2020-09-17 20:13:38
728
原创 回调函数
凡事需要得到一个函数内部异步操作的结果的settimeout - readFile - wirteFile - ajax都需要接受一个回调函数回调函数:function add(x,y,callback){ // var x = 10 // var y = 20 // var callback = function(ret){console.log(ret)} console.log(1) setTimeout(function(){
2020-09-17 18:47:54
132
原创 无法加载文件，因为在此系统上禁止运行脚本
打开管理员模式-鼠标放在开始上，右键管理员模式执行set-ExecutionPolicy RemoteSignedY解决问题：
2020-09-14 16:08:02
3718
1
原创 node底层简单实现评论功能
1./index.html2.开放public目录中的静态资源3 当请求/public/xoxx的时候，读取响应public目录中的具体资源141113./postpost.html4./pinglun4.1接收表单提交数据4.2存储表单提交的数据4.3让表单重定向到/statusCodesetHeaderhttp://127.0.0.1:3000/var http = require('http')var fs = require('fs'...
2020-09-12 10:42:57
905
原创 响应式布局核心-媒体查询
css3媒体查询是核心媒体查询选择器媒体类型：all:所有print：打印screen：彩色屏幕projection:手持设备tv：电视braille：盲文触觉设备embossed：盲文打印机speec：听觉类似媒体设施tty：不适用像素的设备媒体属性：需要满足的条件width： min/maxheight：min/maxdevice-width:max/min设备独立像素、分辨率-webkit-device-pixel-ratio：pc：1.
2020-09-02 13:44:49
182
原创 Animation动画
animation-name：关键帧的名称animation-duration：一个动画周期的时长animation-timing-function：动画的默认效果animation-delay：延迟时间---动画外的属性animation-iteration-count：动画执行效果重复-delay对其不起作用animation-direction:normal（顺时针）reverse(反转)动画执行的方向animation-fill-mode:backwards（与之前的状态一.
2020-08-31 20:29:15
564
原创 百分比问题
top,height,百分比参照于包含块的高度left，margin，padding，width百分比参照于包含块的宽度translate百分比参照于自身的宽高background-position百分比参照于图片区域-图片的位图像素值
2020-08-31 20:18:33
193
原创 3d变形
景深（depth of filed.DOF）：肉眼距离显示器的距离，越大，效果越不好，perspective用于激活一个3d空间，属性值就是景深大小不可以继承，作用给它的子元素：（给一个包裹）让3d场景有近大远小的效果使用的话必须放在首位灭点景深控制的是灭点的位置，景深越大，灭点越远，元素变形越小景深基点：视角的位置。perspective-origin：...
2020-08-31 15:29:42
279
原创 css3实现钟表
时钟：在js中循环出li，作为刻度 使用定时器和transition使得元素动起来 主要锻炼了transition和transfrom的相关属性<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &.
2020-08-30 17:28:10
290
原创 过渡transition
transition：提供了已终止哎css属性时控制动画速度方法。transition-property:width（过渡的属性）（默认值all）transition-duration:2s;(过渡的时间）---对应的时长会被应用到transition-property上面。transition-...
2020-06-08 20:59:43
242
原创 线性渐变
渐变是图片！改变渐变的方向从百分比（像素）的位置开始渐变可以改变角度deg透明度渐变--利用rgba使用透明度渐变重复渐变repeating-linear-gradient<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-
2020-06-07 15:00:58
416
原创 css画出风车
主要应用了css3中border-radius属性，分析以后把border-radius的属性设置为不同的边角 绝对定位把div居中 应用translation属性让元素动起来<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1
2020-06-06 10:52:20
644
原创 自定义字体&图标
自定义字体：可以消除用户对于字体的依赖，每次都需要去加载。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <st
2020-06-03 19:55:09
195
原创 行高line-height
行高：上个文本的基线到下一行文本的基线行距：一行底线到下一行顶线之间的距离（行高-字体大小）内容区：顶线与底线包裹的区域，浏览器的内容区和行内框 = 内容区域行框 = 本行内所有元素行内框max...
2020-05-29 22:53:19
197
原创 vue项目打包时出错-路径问题
vue项目打包时出错，出现路径问题外面新建vue.config.js文件写入module.exports = { publicPath: './'}
2020-05-29 20:02:16
517
原创 css元素垂直水平居中
绝对定位盒子的特性：高宽有内容撑开水平方向上：left+right+width+padding+margin=包含块padding区域的尺寸垂直方向上：top+bottom+height+padding+margin=包含块padding区域的尺寸父元素开启相对定位，子元素开启绝对定位父元素指定高宽，子元素指定高宽已知高度的元素水平垂直居中方案<!DOCTYPE html><html lang="en"...
2020-05-29 19:31:54
160
原创 BFC
box:css布局基本单位Block formatting context:inlineformatting context:Formatting Context：页面中的一块渲染区域，决定管理的盒子，在浏览器中如何定位BFC：块级格式化上下文布局规则：内部的BOX会在垂直方向，一个接一个的放置 BFC的区域不会与float box重叠 内部的Box垂直方向的距离由marigin决定，属于同一个BFC的两个相邻的box的margin会重叠 计算bfc高度时，浮动的元素也参与计.
2020-05-29 18:39:07
124
原创 清除浮动
让浮动的子元素撑开父元素的高度‘1.直接给父元素加高度（扩展性不好）2.通过开启BFC：定位，浮动 浮动盒子的特点和定位盒子的特点：高宽都由内容撑开。（ie6,7不支持）3.br标签清浮动：（ie6,7不支持） 4.空标签清浮动 ：违反了结构行为样式相分离的原则--ie6下元素的最小高度为19px5.伪元素+开启hasloayout ：清除浮动（ie6,7不支持伪元素，所以要额外的haslayout...
2020-05-27 19:00:00
125
原创 粘连布局
当内容的高度足够长的时候，footer应该会跟在main元素的后面当main元素比较短的时候，这个footer元素能够粘连在屏幕的底部<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl
2020-05-26 19:22:57
149
原创 双飞翼布局和圣杯布局比较
圣杯布局和双飞翼布局的对比1.都是把主列放在文档流最前面，使主列优先加载2.三列浮动，通过负外边距形成三列布局3.不同之处在于如何处理中间主列的位置3.1圣杯利用父容器的左右内边距+两个从列相对定位3.2双飞翼布局是把主列嵌套在一个新的父级块中利用主列的左右外边距进行布局调整双飞翼布局<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>&l
2020-05-26 17:47:58
206
原创 伪等高布局
等高布局，利用css maigin 和 padding-bottom属性：先将元素的内边距向外，再将元素的外边距设为负值，最后将父元素的设置为overflow：hidden<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.
2020-05-26 16:32:45
231
原创 音视频标签
videocontrols = “controls”--->控件width和height指定的是video标签的高宽audio标签指定高宽无用容器.avi .mp4 是容器的格式，决定怎么讲视频存起来，不关系储存的内容视频文件：视频轨道，音频轨道，元数据（视频的封面，标题，子标题，字幕）视频格式 ： .mp4 .flv .webm .avi音频格式： .mp...
2020-03-24 10:58:56
354
原创 事件
1.事件绑定(2种)：*eventName(function(){})绑定对应事件名的监听,例如：$('#div').click(function(){});*on(eventName,funcion(){})通用的绑定事件监听,例如：$('#div').on('click',function(){})*优缺点:event...
2020-03-24 10:09:53
101
原创 canvas画布
h5新增元素，通过js脚本来绘制图形<canvas> 对出现，默认width：300px height：150px替换内容，浏览器不支持canvas，会正常显示需要找到它的渲染上下文，通过getContext（‘2d’）方法canvas中画，只有矩形是原生的图形绘制。...
2020-03-18 22:06:35
359
原创 canvas实现刮刮卡效果
刮刮卡效果：这里首先在加载图片作为背景的时候出现了问题，要把position设置为absolute，设置为绝对定位，使得图片跟随父元素的位置学会使用canvas中的增加监听的功能要获取鼠标的坐标，画布的坐标以及相对整个页面的坐标的-牢记canvas使用的基本套路注意stroke fill 的区别 使用save和restore控制样式容器使用beginPath清空整个路径...
2020-03-18 21:46:01
218
原创 h5实现签名
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>签名</title> <style type="text/css"> *{ margin: 0; padding: 0; } body{ ...
2020-03-18 17:02:48
2842
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人