- 博客(135)
- 收藏
- 关注
RSS订阅
原创 【JavaScript】小细节防坑积累（持续更新）
文章目录1. 使用"逻辑或"设置默认值1. 使用"逻辑或"设置默认值此方法不会识别数值 0：function fn(val) { val = val || '默认值'; return val;}fn(0); // '默认值'应改为三元表达式：function fn(val) { val = (val === val ? val : '默认值'); return val;}fn(0); // 0...
2020-10-03 05:47:56
148
原创 【Nuxt3】路由参数（动态路由、嵌套路由）
多层嵌套 params 参数（通常用于捕获404）动态路由参数（与页面路由差不多，但有些区别）
2023-09-23 22:41:32
2290
2
原创 【Nuxt3】安装引入 echarts-wordcloud 报错 window is not defined 解决方法
【代码】【Nuxt3】安装引入 echarts-wordcloud 报错 window is not defined 解决方法。
2023-09-19 09:13:34
1225
1
原创 【Nuxt3】Vue3 + Element-plus 打包后报错 @popperjs/core
Named export 'placements' not found. The requested module '@popperjs/core' is a CommonJS module, which may not support all module.exports as named exports.
2023-09-18 15:15:14
4244
3
原创 【Vue】Antd Affix a-affix 固钉组件，宽度未随父容器宽度变化
Antd Affix a-affix 固钉组件，宽度未随父容器宽度响应变化
2023-01-31 22:17:26
551
原创 vue3、vite，正确安装 Prismjs
vue3、vite 安装 Prismjs。解决报错 prismjs is not a function
2023-01-11 23:22:25
1956
5
原创 【JavaScript】《整体代码script》为何是一个宏任务
JavaScript是一门单线程的语言，因此，JavaScript在同一个时间只能做一件事，单线程意味着，如果在同个时间有多个任务的话，这些任务就需要进行排队，前一个任务执行完，才会执行下一个任务。有很多小伙伴不明白【整体代码script】为何是一个宏任务，为了让大家更好理解这里举个栗子…例子①<!-- 脚本 1 --><script> // 同步 console.log('start1') // 异步宏 setTimeout(() => console.l.
2021-07-14 23:26:41
2785
5
原创 【Node】遍历目录文件，生成 JSON（仅获取文件、非递归）
readfile.js// 导入模块const path = require('path');const fs = require('fs');const pathName = './'; // 需遍历的文件夹路径const jsonPath = './files.json'; // 生成 json 的文件路径// 读取目录fs.readdir(pathName, (err, lists) => { const filesList = []; // 存储遍历的所有文件（未排序
2021-01-13 22:21:32
1174
原创 【JavaScript】fetch的模拟封装（基于promise封装的ajax方法）
近期使用worker线程，发现worker内部无法调用fetch方法，但是可以使用原生的XMLHttpRequest对象、Headers对象、Request对象、Response对象、URLSearchParams对象，所以就模拟封装了一个可以在worker线程调用的函数。目录一、源码二、使用方法1. 在主线程中使用2. 在 Worker 线程中使用三、Some Tips四、获取 XML 数据XML 部分1. 主线程读取 XML 数据2. Worker 线程读取 XML 数据一、源码/** * [基
2021-01-09 03:38:42
389
原创 【Vue】methods、computed与filters
文章目录一、某些情况，三者可以实现同样的功能二、三者区别1. methods与computed的 异同一、某些情况，三者可以实现同样的功能<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.
2020-12-27 01:34:38
218
原创 【Node.js】windows安装nvm-windows
参考： 1. 使用 nvm 管理不同版本的 node 与 npm（菜鸟教程） 2. nvm-windows（安装包下载） 3. nvm的使用 nodejs版本管理（报错解决）1.安装教程参考Windows下安装及使用NVM2. nvm ls available 命令报错命令：列出远程服务器上 NodeJS 所有的可用版本。报错内容（限制）解决方法node_mirror:npm.taobao.org/mirrors/node/npm_mirror:npm.taobao...
2020-12-19 01:17:33
786
1
原创 【Node.js】cnpm、webpack、webpack-cli、vue-cli的安装
Node.js：https://nodejs.org/zh-cn/安装步骤：一、《1~3步骤》请参考该博文node.js 安装详细步骤教程二、《4步骤》请看此处上面教程中，第4步是使用 npm 安装 webpack，所以很慢，且有可能会报错。1. 在此之前，请先改用cnpm（删除代理，再安装cnpm）npm config rm proxynpm config rm https-proxynpm install -g cnpm -registry=https://registry.npm.
2020-12-18 19:30:09
582
原创 js实现图片放大镜
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> * { padding: 0; margin: 0; box-sizing: border-box; } .wrap { width: 400px; hei.
2020-12-17 07:12:04
335
原创 【Git/Github】删除远程仓库中的文件/文件夹
远程仓库文件：文章目录一、原本地git仓库（原上传文件夹未删除）1. 删除工作区文件（可以直接鼠标右键删除）【可以只命令删除暂存区文件】2. 更新到本地git仓库3. 更新到远程仓库（推送）4. 刷新页面即可二、其它文件夹操作（原上传文件夹已删除）1. 初始化2. 拉取远程仓库的代码3. 删除工作区文件（或直接鼠标右键删除）【可以只命令删除暂存区文件】4. 更新到本地git仓库5. 创建并切换分支（要和远程仓库一致）6. 本地库与远程库建立连接7. 更新到远程仓库（推送）8. 刷新页面即可一、原本地g
2020-12-16 02:50:14
701
原创 【Git/Github】向已有仓库上传文件/文件夹
已有仓库：文章目录一、直接拖动文件上传1. 打开远程仓库点击upload2. 点击或拖动文件/文件夹上传二、通过git命令上传第一种：在原本地仓库新增的文件1. 初始化2. 将新增的文件/文件夹添加到暂存区3. 提交暂存区到本地git仓库4. 推送到远程仓库5. 刷新github页面即可第二种：在其它文件夹内的文件1. 初始化2. 下载远程仓库的代码，并合并3. 将新增的文件/文件夹添加到暂存区4. 提交暂存区到本地git仓库5. 创建并切换分支（如果没有的话，要和远程仓库一致）6. 将本地库添加到远程
2020-12-16 02:11:50
8263
原创 【Git/Github】首次上传&删除仓库
文章目录新建远程仓库1. 添加新仓库2. 设置仓库名3. 在vsc终端输入Github提供的bash命令即可删除远程仓库i. 打开仓库列表ii. 打开需操作的仓库iii. 点击设置ⅳ. 滚动到最下面，点击删除ⅴ. 跟着输入，确认即可新建远程仓库1. 添加新仓库2. 设置仓库名3. 在vsc终端输入Github提供的bash命令即可删除远程仓库i. 打开仓库列表ii. 打开需操作的仓库iii. 点击设置ⅳ. 滚动到最下面，点击删除ⅴ. 跟着输入，确认即可...
2020-12-15 17:52:09
174
原创 【HTML5】Application Cache（应用程序缓存）
传送门：HTML5 应用程序缓存 —— 菜鸟教程配置模板：CACHE MANIFEST# manifest 离线缓存# 2020-07-17 v1.0.0CACHE:# 缓存文件../images/头像.png../images/login_账户.png../images/login_密码.png../script/login/chkLogin.js../styles/login.css../styles/reset.cssNETWORK:# 不需要缓存的文件login
2020-12-11 19:21:47
171
原创 【HTML5】IndexedDB
传送门： 1. JavaScript 教程 / 浏览器模型 / IndexedDB API —— 阮一峰（详） 2. 浏览器数据库 IndexedDB 入门教程 —— 阮一峰（简） 3. 【HTML5】Web SQL Database【已废弃】文章目录1、IndexedDB 基本操作【异步操作】2. Web SQL 基本操作【对比】【已废弃】1、IndexedDB 基本操作【异步操作】var dbName = 'demo'; // 数据库名var version = '1.0'; //..
2020-12-11 04:07:06
226
原创 【API】聊天机器人接口
传送门： 1. 漫小猫API 2. 天行数据文章目录一、无key直接调用的api1. 接口地址2. 示例二、需要个人密钥调用的接口1. 接口地址2. 示例一、无key直接调用的api1. 接口地址漫小猫API聊天接口（免费，还有其它蛮不错的API）2. 示例通过ajax发送GET/POST请求，返回JSON数据，拿到数据后输出。<!DOCTYPE html><html lang="zh"><head> <meta charset=..
2020-12-08 19:59:31
17994
4
原创 【API】随机获取图片
传送门：（API搜来搜去就这几个，都一样的） 1. 可以获取随机图片的API收集 必应 等 2. 随机图片获取api 3. 随机获取图片的api接口 4. 另类随机图片API 5. php – 通过curl从url获取JSON数据文章目录一、获取Blob文件1. 必应每日图组（量少，快速）【配合后端抓取源码】2. 直接ajax请求外部服务器API（一）（量多，略慢）【可跨域访问】3. 直接ajax请求外部服务器API（二）（量多，略慢）【可跨域访问】二、获取JSON数据【未实现，待完善，留..
2020-12-08 02:28:31
1299
原创 【HTML5 + JavaScript】点击或拖拽上传图片，显示缩略图
传送门： 1. JavaScript 教程 / 浏览器模型 / ArrayBuffer 对象，Blob 对象 2. HTML5 - 通过拖拽读取图片文件（将电脑中图片拖入浏览器并显示） 3. js实现file上传图片在div中显示与点击div触发file表单<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title..
2020-12-06 03:24:23
1581
原创 【JavaScript】fetch()函数、URLSearchParams对象
传送门： 1. JavaScript 教程 / 浏览器模型 / Location 对象，URL 对象，URLSearchParams 对象 2. MDN - 使用 Fetch 2. Fetch - 数据交互方式 3. 详解fetch的使用方法及如何接收JS传值文章目录一、原生ajax - 数据交互二、fetch - 数据交互三、使用 URLSearchParams 对象四、其它接口对象的使用server.php<?php echo $_POST['foo'] + $_POST..
2020-12-06 01:00:14
618
原创 【HTML5】Web Storage 事件
传送门：JavaScript 教程 / 浏览器模型 / Storage 接口该事件并不会在当前改动的页面触发，而是在同源且打开的页面才会被触发1. 示例a.html（http://aaa.com/a.html）【操作】<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wid
2020-12-04 01:35:42
191
原创 【HTML5】Server-Sent 事件（SSE）
传送门 文章目录1. 同域2. 跨域1. 同域a.html<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=..
2020-12-02 16:24:32
284
原创 【跨域请求（七）】CORS 跨资源共享《单向跨域》
传送门： 1. JavaScript 教程 / 浏览器模型 / CORS 通信 2. CORS ajax跨域请求php简单完整案例一则文章目录一、简单请求二、非简单请求一、简单请求a.html（http://aaa.com/a.html）<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="..
2020-12-01 17:54:57
153
1
原创 【跨域请求（六）】server proxy（后端文件中转代理）《单向跨域》
1、跨域获取 php 文件数据a.html（http://aaa.com/a.html）<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con
2020-11-24 16:30:11
430
1
原创 【跨域请求（五）】window.name + iframe《单向跨域》
PS： 该方法原本有个跟 a.html 同域的代理页用于切换，但是我觉得特意开出一个空白页太浪费，于是尝试着切换回 a.html，发现可行。a.html（http://aaa.com/a.html）<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-
2020-11-23 23:21:26
188
1
原创 【跨域请求（四）】document.domain + iframe《双向跨域》
一、document.domain + document.cookiea.html（http://aaa.demo.com/a.html）<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq
2020-11-23 18:31:41
294
原创 【跨域请求（三）】FIM —— Fragment Identitier Messaging（location.hash + iframe）（中间代理页）《双向跨域》
a.html（http://aaa.com/a.html）<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"&g.
2020-11-23 12:58:43
165
原创 【跨域请求（二）】postMessage《双向跨域》
核心： 1. postMessage()方法：向其他窗口发送消息； 2. message事件：监听其他窗口（postMessage）发送过来的消息；文章目录一、单向通信1. 【打开B，B接收A的消息】2. 【打开B，A接收B的消息】二、双向通信1. 【打开B，B先接收A消息，再回复A】2. 【打开B，A先接收B消息，再回复B】一、单向通信1. 【打开B，B接收A的消息】a.html【A域】（http://aaa.com/a.html）<!DOCTYPE html>&..
2020-11-22 01:34:39
223
1
原创 【CSS3】flex布局防坑（flex盒子固定宽高带来的问题）
1. 产生问题：弹性子元素内的子元素，设置百分比高会溢出弹性容器弹性子元素的高度百分百等于父元素的高度，但是却被前面（上面）的兄弟元素挤下来了。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t
2020-11-10 11:16:08
2400
原创 【CSS3】关于过渡、动画属性的一些小知识的补充（性能优化）
1. 位移推荐使用absolute，避免对他元素造成影响margin-top/right/bottom/left与absolute + top/right/bottom/left都能令元素进行位移，但是absolute令元素脱离文档流，可以避免对布局造成影响。【float 也可以脱离文档流，可以配合margin-*，但是应尽量避免使用 float 布局（别问为什么，问就是需要清除浮动，而且 float 的初衷也不是给你布局用的）】【fixed 就更不用说了吧，特殊情况，如导航固定、置顶固定都是需要的】
2020-11-09 20:28:48
692
原创 【JavaScript】加载外部脚本使用的协议
来源：JavaScript 教程 / 浏览器模型 / 浏览器模型概述 / 2.5 加载使用的协议1. 默认 http 协议<script src="javascript.js"></script>2. 默认 https 协议<script src="https://javascript.js"></script>3. 继承页面协议<script src="//javascript.js"></script>...
2020-10-30 17:59:39
268
原创 【JavaScript】事件代理
1. 非事件代理【影响性能】<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title></title></head><body> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</
2020-10-30 16:01:30
82
原创 【JavaScript】setTimeout() 为何会连续打印多个“5”？（执行机制）
引文：JavaScript 教程 / 异步操作 / 定时器【你会学到更多此类知识，更深入理解 setTimeout()】for (var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); }, 1000);}你以为：// 每秒打印// 0// 1// 2// 3// 4实际：// 首先执行for (var i = 0; i < 5; i++) {} // for 比 setTiemout(
2020-10-26 19:16:31
584
原创 【JavaScript】setTimeout 与 setInterval 的细节区别（存在的误差区别）
来源：JavaScript 教程 / 异步操作 / 定时器 / 2. setInterval()1. setTimeout() 指定某个函数或某段代码，在多少毫秒之后执行；2. setInterval() 指定的是“开始执行”之间的间隔，并不考虑每次任务执行本身所消耗的时间；示例对比setTimeout()：【发现执行时间比较长，主要是因为它执行完当前代码后，才开始延迟时间去执行下一个循环】var timer = setTimeout(function f() { if (i ===
2020-10-26 02:51:13
206
转载 【JavaScript】对象的拷贝
来源：JavaScript 教程 / 面向对象编程 / Object 相关的方法 / 10. 对象的拷贝 如果要拷贝一个对象，需要做到下面两件事情： 1. 确保拷贝后的对象，与原对象具有同样的原型； 2 确保拷贝后的对象，与原对象具有同样的实例属性；function copyObject(orig) { var copy = Object.create(Object.getPrototypeOf(orig)); copyOwnPropertiesFrom(copy, orig); r
2020-10-23 00:57:20
107
转载 【JavaScript】获取对象属性
来源：JavaScript 教程 / 面向对象编程 / Object 对象的相关方法 / 9. in 运算符和 for…in 循环获取自身的可枚举属性【Object.keys()】var obj = {a:1};var arr = [0,1,2];Object.keys(obj); // ["a"]Object.keys(arr); // ["0", "1", "2"]获取自身或继承的可枚举属性【Object.getOwnPropertyNames()】var obj = {a:1
2020-10-23 00:47:55
154
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人