大赚万万亿

原创 css计数器

计数器有两个关键属性。

原创 对等依赖报错问题及解决办法

npm v7之后对等依赖出现的问题。

原创 Web Animations API 动画

好处是可以不干扰dom原本的动画,onfinish事件可以监听结束。dom.animate动画可以避免污染dom原有的css动画。

原创 静态资源动态访问的细节补充import()与new URL

import里若用引号拼接,那么打包结果不会有图片。new URL返回的实例有多个属性。细节1:得用es6的反单引号才可以。用new URL构建地址。细节2:不能以变量结尾。

原创 react-router v6的Link组件relative属性解释

Link组件有一个名为relative的属性,值为route或path,默认为route。所以在处理两个点的路径时,path是回到相对路径的上一级,通俗的讲就是网址上的斜杠少一层。之前由于路径嵌套不够深,看不出区别,于是尝试加深路径,一眼就看出了区别。而route意味着回到程序员配置该路由时的父级。

原创 ScrollRestoration react-router-dom V6

如A页面向下滑动一些后,点击跳转到B页面,然后在B页面点击标签回到A页面时,会在上次滑动的位置出现。在移动端使用搭配组件跳转时,可记录之前的滑动位置。浏览器自带的返回按钮不受影响,只影响组件互相跳转时恢复位置。实参matches里有上述handle的值,可加入自己的一些参数。在Test和About组件内加入以下代码,放在根div内即可。以下测试环境为微信内的浏览器。

原创 解决弹窗内容滚动时,后方body也一起滚动的问题

网页里有小的modal弹窗,如果内容过多,需要垂直滚动,那么滚动到底部后继续滚动,会牵连到body也一起滚动.github有一个库叫iNoBounce可以阻止滚动。

原创 阻止默认行为 e.preventDefault()搭配passive:false才有效

如果想阻止默认行为,那么 e.preventDefault()搭配passive:false才是正解。如果搭配 passive:false,则会报警告。如果只阻止默认事件,第3个选项不写,也会警告。

原创 async与defer的区别

原文解释。

原创 jwt解释

彻底理解JWT【渡一教育】_哔哩哔哩_bilibili注意！天天用到的JWT是明文存储的，重要数据可不要“走光”啦！【渡一教育】_哔哩哔哩_bilibili

原创 canvas变换矩阵说明

原创 js的new操作符具体做了什么

【代码】js的new操作符具体做了什么。

原创 js的MediaRecorder录音录视频方法笔记

视频录制基础知识-MediaRecorder。* 通过 web 录制视频（摄像头）并上传。

原创 nodejs搭配ffmpeg获取视频时长

【代码】nodejs搭配ffmpeg获取视频时长。

原创 colorThief+vite+react使用方法

图片如果设计跨域,那么需要在img标签上增加crossorigin,同时对应的图片服务器也要增加允许跨域,缺一不可.第一种,import载入图片。第二种,new Image实例。

原创 正则知识点

原创 闭包的记忆与工厂函数

原创 2个提供临时电话的网站

临时电话临时电话。

原创 前端ui库搜集

涟漪动画效果 - MDUI 开发文档, Material Design 前端框架。添加涟漪动画效果后，会在点击元素时，产生向外扩散的水波纹效果。

原创 Nodejs搭配axios下载图片

实测发现只需保留node_modules文件夹，删除package.json不影响使用。用于wordpress文章中外链图片的替换。新建一个文件夹，npm i axios。替换部分图片地址并生成新文件及下载。从html文件中获取图片地址。

原创 wordpress删除各种类型评论的sql语句

comment_approved 等于trash: 回收站的评论。comment_approved 等于spam : 垃圾评论。comment_approved 等于1:通过审核的评论。comment_approved 等于0:待审核的评论。

原创 XHR与Fetch的功能异同点列表

XHR与Fetch的功能异同点列表。

原创 runoob.com的正则断言解释

正则表达式的先行断言(lookahead)和后行断言(lookbehind) | 菜鸟教程

原创 Driver.js引导用户步骤

Driver.js中文网

原创 阻止默认事件失败的解决办法

老版本：当用户触发我们定义的监听事件时候（如条件1中的“touchmove”事件），浏览器会主动检测对应的handler代码中是否有event.preventDefault(),以便进行默认事件阻止。那么问题就来了，我们不知道我们的事件已经默认被定义为了被动事件监听。谷歌浏览器对event.preventDefault()（默认事件阻止）的检测机制变化导致的（听不懂？上面两个代码效果相同，我们经常用第一条，不知不觉中定义了一个被动监听事件。表示当触控事件发生在绑定的dom上时，不进行任何操作。

原创 个人微信号,未认证状态下，通过自己的服务器设置更丰富的关键字回复

个人微信号,未认证状态下,也可以通过自己的服务器设置更丰富的关键字回复。

原创 js指纹库，可跟踪用户唯一性

fingerprintjs官网资料：Browserleaks - Check your browser for privacy leaks

原创 SVG的viewBox、width和height释义, 示例及代码

其中x，y就是用于定义svg画布在世界坐标下的位置，通过修改x，y可以移动画布在世界坐标下的位置。svg的是没有边界的，svg画布只是用于展示svg世界中某一个范围的内容，而对于超过了svg画布范围的内容，则会被遮挡。当wheight的时候，相当于拉远了视野，视野变大了，但实际显示的区域没有发生变化；这就会导致显示的图形变小，显示的区域变大。

原创 vue3 在vite.config中无法使用import.meta.env.*的解决办法

第一种,优先使用第一种方法,其中参数mode就是自定义--mode的值,如果没写,就是production或development。

原创 css中counter的使用

原创 AutoAnimate动画库,仅需一行代码

插件官网,支持react,vue。

原创 解决canvas清晰度问题devicePixelRatio

在项目中,canvas里的原始尺寸一般与css中的样式尺寸一样,所以在写js代码时,涉及canvas的尺寸都需要加devicePixelRatio。检测网页本身是否缩放 ,即缩放倍率。为了获得清晰图像,需要遵循以下公式。原始尺寸=样式尺寸*缩放倍率。

原创 img的css属性:object-fit详解

原创 background的多种用法，包括渐变+背景图

top left斜杠后的数值是图片的大小，可以用cover或contain。多背景图时，层叠关系。

原创 利用document.write阻塞js文件加载

利用document.write加载js的好处是会阻塞后续的js记载,必须等待当前js加载并执行完毕后,才会加载后续的js文件,保证了顺序性。注意需要添加3个转义符。

原创 colorThief.js获取图片主色调,用来做banner的背景不错

视频教学官方说明。

原创 react等效memo的方法

创建一个组件，将state的color和input写上，而ExpensiveTree作为插槽，以children的形式加载，children组件的props若不变，那么children组件不会重新渲染。第二种情况，color在ExpensiveTree组件的父级dom。把与ExpensiveTree的无关的dom做成一个组件。

原创 前端环境变量释义process.env与import.meta.env

使用import.meta.env.VITE_xxxxx进行调用。1：添加命令行参数 --mode=xxxxx。以VITE_开头，字符串无需加双引号。新建.env.xxxx文件。

原创 vConsole在线引用

【代码】vConsole在线引用。

原创 react使用wx-open-launch-weapp的方法

ios浏览器中,建议直接在app.js中触发 wx.config,其中openTagList写上wx-open-launch-weapp。因为微信需要根据网址计算签名,ios+react中会以根目录为有效网址。index.html中加载。