- 博客(74)
- 资源 (15)
- 收藏
- 关注
RSS订阅原创 浅尝coze扣子开发
Coze扣子开发摘要 Coze扣子是一款无代码/低代码AI开发平台，支持30秒创建AI智能体。核心功能包括： 拖拽式工作流编排，集成GPT-4等大模型； 60+预置插件（如公众号助手、链接读取）； 知识库管理（支持PDF/TXT）； 多平台发布（微信、飞书等）。 开发案例展示了公众号文章仿写工作流，包含三个关键模块： 文章分析（提取风格、摘要） 内容生成（1200字原创） 标题创作（10万+爆款标题） 通过链接读取插件获取原文，大模型处理后再用公众号助手发布。 提示词工程是核心，需精细设计系统提示控制输出格
2025-07-21 17:30:29
1306
1
原创 前端提升之——chrome浏览器插件开发指南——chrome插件介绍及入门
有一天突发奇想，想要自己写一个浏览器插件玩一玩，并不做用于商业或者其他方面，仅仅用于自我技术的练习和提升。这里的浏览器我选择Chrome，当然chrome插件同样适用于微软自带的 Microsoft Edge在当今发达的互联网环境下，也找到了诸多的资料教程。个人也有个习惯，学习一个新的东西，虽然说前人已经有诸多的文章，但是我还是会将自己对于这个技术的一些个人感悟加上前人们写的很好的东西重新整理一次。我所有的参考文章均在本文的最后。
2024-08-26 19:26:01
2104
原创 vue鼠标悬停事件监听
前言 开发框架为 vue2.x 情景描述 需求是这样的：页面在鼠标悬停（不动）n秒之后，页面进行相应的事件。 比如在我的需求下，是鼠标悬停15秒之后，页面上三个数据弹窗轮询展示。 解决方法 我的思路中 涉及到了三个变量 data(){ return { polling: null, timeCount: 0, judgeTimer: null, } } polling： 是 轮询的时候的一个计时器 timeCount： 是 判断鼠标是否移动的一个控制变量 jud
2022-05-16 11:56:55
12360
原创 前端须知-MVVM
前言 Model–View–ViewModel(MVVM) 是一个软件架构设计模式，由微软 WPF 和 Silverlight 的架构师 Ken Cooper 和 Ted Peters 开发，是一种简化用户界面的事件驱动编程方式。由 John Gossman（同样也是 WPF 和 Silverlight 的架构师）于2005年在他的博客上发表。 MVVM 源自于经典的 Model–View–Controller（MVC）模式（期间还演化出了 Model-View-Presenter（MVP）模式，可忽略不计
2021-12-22 16:39:55
636
原创 阿里云 + Ubuntu + WordPress 建造个人博客网站
前言 需要准备的东西： 需要注册一个域名 域名需要备案 需要购买一个ESC服务器 上述的操作，非常的简单，就不多叙述了 一、阿里云ESC服务器配置 1.首先远程连接服务器 输入用户名密码 根据提示输入，Linux 用户名一般为 root，密码如果忘记了，可以修改 2.系统升级和更新源 sudo apt-get update sudo apt-get upgrade 3. 配置apache2 apt-get install apache2 -y 在本地计算机（您自己使用的电脑打开浏览器）输入h
2021-12-20 11:50:24
1228
原创 uni-app 长按事件无法被页面滚动或滑动阻止问题解决
问题描述 uni-app 中 长按事件使用的是 @longpress或者 @longtap 需要触发该事件的 element 位于一个能够上下滚动的页面中 长按的元素在长按期间有页面滚动或者页面滑动时不触发长按 解决 @longpress或者 @longtap这两个事件 的触发时间是在 350ms 查阅了一些资料，发现无法更改这两个事件的 触发时间 所以我们希望在长按触发前如果有页面滑动或者滚动时阻止长按触发 有这么一个事件 @touchmove 其功能描述如下 手指触摸后移动 解决代码 <te
2021-12-03 16:11:29
3449
2
原创 JavaScript常用工具——深度克隆（可直接复制）
前言 在项目中，一些对象数据我们不能直接拿来赋值的使用，否则可能引起原对象的变化，不符合开发的规范。 例如vuex中存储的一些对象 这时候我们需要进行深度克隆 关于深度克隆和浅层克隆的知识点，可以看我之前的博客 JavaScript之克隆（浅层克隆，深度克隆） 以下是我所些的深度克隆函数，可以直接copy使用 deepCopy.js // deepCopy function typeOf(obj) { const { toString } = Object.prototype; const ma
2021-11-05 16:48:07
711
原创 设计模式总结项目练习——贪吃蛇
前言 通过设计模式写出的 demo 可拓展性强 GitHub链接 utils.js // 符合单一职责原则 const tool = { inherit: function (target, origin) { const Fun = function () { }; Fun.prototype = origin.prototype; target.prototype = new Fun(); // 让子类的constr
2021-10-28 18:49:25
374
原创 前端须知——行为型模式——观察者模式
定义： 观察者模式，属于行为型模式的一种，它定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个主题对象。这个主题对象在状态变化时，会通知所有的观察者对象，使他们能够自动更新自己。 举个栗子： 以学生为例，上课和下课的铃声就是被观察者，学生就是观察者，当下课铃声响了，学生就知道下课了，就出去跑着玩了，然后过了10分钟，上课铃声又响了，然后学生听到上课铃，又开始从外面往教室跑，去上课。 1、DOM事件 其实我们在平时也用到过观察者模式，只是我们没有注意到而已，举一个简单的例子：我们曾
2021-10-28 18:47:53
558
原创 前端须知——行为型模式——策略模式
策略模式是JavaScript设计模式中行为型的设计模式 白话解释 实际上所谓的策略模式就是指根据不同的策略来执行不同的方法，是不是很类似与if-else分支判断；但是策略模式是用来解决多重条件判断语句的； 详解 例子 年终将至，某公司决定提前发年终奖，但是年终奖的计算是有一定的规则的，年终奖的多少跟绩效考核密切相关；所以某公司的年终奖方案是这样的： 绩效考核为S的员工，年终奖是个人月工资的4倍； 绩效考核为A的员工，年终奖是个人月工资的3倍； 绩效考核为B的员工，年终奖是个人月工资的.
2021-10-28 18:47:08
349
原创 前端须知——结构型模式——装饰者模式
定义 在不改变元对象的基础上，通过对其进行包装拓展（添加属性方法） 装饰者模式可以动态的给某个对象添加一些额外的职责，而不会影响从这个类中派生出的其他对象 装饰者(decorator)模式能够在不改变对象自身的基础上，在程序运行期间给对像动态的添加职责。与继承相比，装饰者是一种更轻便灵活的做法。可以当脚本运行时，在子类中增加行为会影响原有类所有的实例，而装饰者却不然。取而代之的是它能给不同对象各自添加新行为 模拟传统面向对象语言的装饰者模式 首先要提出来的是，作为一门解释执行的语言，给Jav
2021-10-28 12:19:31
362
原创 前端须知——结构型模式——代理模式
代理模式 代理模式属于设计模式中结构型的设计模式； 定义 为一个对象提供一种代理以控制对这个对象的访问 白话解释： 很多明星都是有经纪人的，如果要联系明显进行商演或者开演唱会之类的商业活动通过是需要先跟经纪人取得联系的，跟经纪人谈好了合作事宜之后经纪人再转达给某明星，然后某明星才会去参加活动；同样租房也是一个同样的道理，我们不管是租房还是买房，第一反应肯定是找链家这类的平台，因为我们只需要跟链家进行沟通，而链家去跟房东沟通，省去了我们直接和房东沟通的步骤；因为链家就是一个代理模式，它代理了这个房东
2021-10-28 12:08:26
235
原创 前端须知——创造型模式——单例模式和工厂模式
单例模式 定义 保证一个类仅有一个实例，并提供一个访问它的全局访问点。 数学与逻辑学中，singleton定义为“有且仅有一个元素的集合”。 为什么要用单例模式 想象一下某些web应用，当点击登录按钮时，会弹出一个登录框，无论你点击多少次这个登录按钮，登录框都只会出现一个，不会出现多个登录框。同时不会频繁的进行删除和添加，而是同一个登录框进行隐藏和显示，因为删除和添加十分耗费性能，所以单例可以达到最大化的效能利用。 登录框这个例子就是单例模式最典型的应用，符合业务的需求，又能够提高性能 详解 在
2021-10-28 11:55:15
496
原创 JavaScript——继承
JS继承 1.传统形式 ==> 原型链 问题：过多的继承了没用的属性 Grand.prototype.lastName = 'Ji'; function Grand() { } var grand = new Grand(); Father.prototype = grand; function Father() { this.name = 'hehe'; } var father = new Father(); Son.prototype = father; function Son
2021-10-28 11:53:53
260
原创 前端必须知道——设计模式六大原则
六大原则 1. 单一职责原则 single Responsibility principle 一个方法只做一件事情，请求数据的函数你就不要渲染数据了，吃饭上厕所别用同一个地方 假设我们涉及的一个函数，不按照单一职责原则来写，代码的复杂度会提高，因为一个函数内部含有多个功能，而实际上，每个功能都可以独自拆分程一个独立的函数。 也就是说，每个函数来写一个功能。诸多函数汇总起来，就要形成耦合，也就是以牺牲耦合度的代价来降低复杂度。 2.开闭原则 OCP 开闭原则 OCP 一个软件实体如类、模块和函
2021-10-28 11:28:53
1877
原创 前端必须知道——什么是设计模式
什么是设计模式 设计模式（Design Pattern）是一套被反复使用、多数人知晓的、经过分类的、代码设计经验的总结。 设计模式是对软件设计开发过程中反复出现的某类问题的通用解决方案。设计模式更多的是指导思想和方法论，而不是现成的代码，当然每种设计模式都有每种语言中的具体实现方式。学习设计模式更多的是理解各种模式的内在思想和解决的问题，毕竟这是前人无数经验总结成的最佳实践，而代码实现则是对加深理解的辅助。 用人话来讲，就是想出套路做事情 模式是什么 模式是指从生产经验和生活经验中经过抽象和
2021-10-28 11:23:18
315
原创 关于vue在PC端，对不同屏幕进行适配，未使用媒体查询（大小的自适应）的问题（ant-design-vue，element-ui 均可使用）
前言 前端项目中，难免会遇到这种问题，你根据UI的设计图在本机搭建页面，显示比例或许会是正常的，但是你将页面缩放，或者说，你将页面移植到其他尺寸的屏幕中，显示的UI效果就会变形。 所以，我们需要对我们的项目进行多屏幕适配 以下是我个人在 vue 项目中的适配方法，亲测在 使用 ant-design-vue 和 element-ui 组件库时任然有效。 不过这个方法无法更改行间样式，例如 element-ui 的 form 组件 的 label 添加行间样式，此时，就无法通过下面的方法进行适配
2021-10-27 14:26:25
4698
2
原创 21.合并两个有序链表——JavaScript
原题描述 原题链接 将两个升序链表合并为一个新的 升序 链表并返回。新链表是通过拼接给定的两个链表的所有节点组成的。 示例 1： 输入：l1 = [1,2,4], l2 = [1,3,4] 输出：[1,1,2,3,4,4] 示例 2： 输入：l1 = [], l2 = [] 输出：[] 示例 3： 输入：l1 = [], l2 = [0] 输出：[0] 提示： 两个链表的节点数目范围是 [0, 50] -100 <= Node.val <= 100 l1 和 l2 均按 非递减顺序
2021-06-11 14:30:20
432
3
原创 20. 有效的括号——JavaScript
原题描述 原题链接 给定一个只包括 '('，')'，'{'，'}'，'['，']' 的字符串 s ，判断字符串是否有效。 有效字符串需满足： 左括号必须用相同类型的右括号闭合。 左括号必须以正确的顺序闭合。 示例 1： 输入：s = “()” 输出：true 示例 2： 输入：s = “()[]{}” 输出：true 示例 3： 输入：s = “(]” 输出：false 示例 4： 输入：s = “([)]” 输出：false 示例 5： 输入：s = “{[]}” 输出：true 提示
2021-06-11 12:00:19
164
3
原创 14.最长公共前缀——JavaScript
原题描述 原题链接 编写一个函数来查找字符串数组中的最长公共前缀。 如果不存在公共前缀，返回空字符串 “”。 示例 1： 输入：strs = [“flower”,“flow”,“flight”] 输出：“fl” 示例 2： 输入：strs = [“dog”,“racecar”,“car”] 输出："" 解释：输入不存在公共前缀。 提示： 0 <= strs.length <= 200 0 <= strs[i].length <= 200 strs[i] 仅由小写英文字母组成
2021-06-11 11:50:27
182
3
原创 GitHub官网访问慢的解决问题
1.首先我们进行DNS查询 2.输入github.com进行检测 3.查询后，会有如下的列表集合 4.看后面TTL值较小的，把IP地址复制。 5.找到本地的hosts文件记事本打开, 位置如下 6.用记事本等工具打开 在后面换行追加 IP地址 github.com 这里的IP地址就是上面检测TTL比较小的IP地址，例如： 7.修改完保存 保存后就可以访问github了，不出意外的话，现在的访问速度应该边快递。如果改完之后不好用的话，再换一个其他的地址。 8.还是慢，怎么办 这里提供两个最常用的镜
2021-05-22 21:10:28
1716
原创 前端网络技术提升
3次握手，4次挥手 在讲三次握手和四次挥手之前，我们要了解一个东西 首先，我们网络请求的过程中，我们网络请求的发送方和接收方，之间的通讯，应该是没有障碍的 通信的过程，如果想要建立稳定的链接的条件：通信双方都要有接收信息和发送信息的能力 客户端需要明确 ： 服务器端要有接收信息的能力 以及给予回应的能力 服务器端需要明确：客户端需要有接受信息和 发送信息的能力 所以我们的三次握手，主要就是为了建立一个稳定的连接 那么我们来思考一下，为什么要三次握手才能证明建立稳定的连接呢？ 假设，
2021-05-20 13:58:21
177
1
原创 前端网络——get和post的区别
面试常问！！！ 基于什么前提 ？如果什么前提也没有，不适用任何的规范，只考虑语法和理论上的http协议 GET 和 POST 几乎没有区别，只有名字不一样，仅此而已 如果是基于RFC规范的。 （1） 理论上的（Specification）：GET 和 POST具有相同语法的，但是有不同的语义。GET是用来获取数据的，POST是用来发送数据的，其他方面没区别 （2）实际上的（Implementation）：各个浏览器，就是这个规范的实现者。 所以才有常见的不同： 1）GET的数据在URL是可见的
2021-05-20 09:20:06
874
原创 ajax获取图片数据，实现瀑布流功能
封装 AJAX // ajax: async javascript and xml (json) "{}" // 异步的JavaScript 和 xml（json） // 同步：一行一行 （按顺序执行） // 异步：同时进行的 // 用途： 数据交互 // 用 问问题来举例 类比 网络请求 // 问问题： // 问的问题内容： ---> 请求参数 // 问的是谁： ---> 接口 // 通过什么方式去问
2020-12-04 13:35:45
412
1
原创 3.LeetCode（无重复字符的最长子串）——JavaScript
题目描述 原题链接 给定一个字符串，请你找出其中不含有重复字符的 最长子串 的长度。 示例 1: 输入: s = "abcabcbb" 输出: 3 解释: 因为无重复字符的最长子串是 "abc"，所以其长度为 3。 示例 2: 输入: s = "bbbbb" 输出: 1 解释: 因为无重复字符的最长子串是 "b"，所以其长度为 1。 示例 3: 输入: s = "pwwkew" 输出: 3 解释: 因为无重复字符的最长子串是 "wke"，所以其长度为 3。 请注意，你的答案必须是 子串 的长
2020-12-04 12:33:20
216
原创 4.LeetCode（寻找两个正序数组的中位数）——JavaScript
题目描述 原题链接 给定两个大小为 m 和 n 的正序（从小到大）数组 nums1 和 nums2。请你找出并返回这两个正序数组的中位数。 进阶：你能设计一个时间复杂度为 O(log (m+n)) 的算法解决此问题吗？ 示例 1： 输入：nums1 = [1,3], nums2 = [2] 输出：2.00000 解释：合并数组 = [1,2,3] ，中位数 2 示例 2： 输入：nums1 = [1,2], nums2 = [3,4] 输出：2.50000 解释：合并数组 = [1,2,3,4] ，中位数
2020-12-03 18:54:50
477
原创 9.LeetCode（回文数）——JavaScript
题目描述 原题链接 判断一个整数是否是回文数。回文数是指正序（从左向右）和倒序（从右向左）读都是一样的整数。 示例 1: 输入: 121 输出: true 示例 2: 输入: -121 输出: false 解释: 从左向右读, 为 -121 。 从右向左读, 为 121- 。因此它不 是一个回文数。 示例 3: 输入: 10 输出: false 解释: 从右向左读, 为 01 。因此它不是一个回文数。 进阶: 你能不将整数转为字符串来解决这个问题吗？ 我的解法 日常暴力解题。。。 /** * @pa
2020-12-02 20:54:04
189
原创 976.LeetCode（三角形的最大周长）——JavaScript
题目描述 原题链接 给定由一些正数（代表长度）组成的数组 A，返回由其中三个长度组成的、面积不为零的三角形的最大周长。 如果不能形成任何面积不为零的三角形，返回 0。 示例 1： 输入：[2,1,2] 输出：5 示例 2： 输入：[1,2,1] 输出：0 示例 3： 输入：[3,2,3,4] 输出：10 示例 4： 输入：[3,6,2,3] 输出：8 提示： 3 <= A.length <= 10000 1 <= A[i] <= 10^6 本人解法 /** * @par
2020-12-01 08:36:44
275
原创 7.LeetCode（整数反转）——JavaScript
题目描述 原题链接 给出一个 32 位的有符号整数，你需要将这个整数中每位上的数字进行反转。 示例 1: 输入: 123 输出: 321 示例 2: 输入: -123 输出: -321 示例 3: 输入: 120 输出: 21 注意: 假设我们的环境只能存储得下 32 位的有符号整数，则其数值范围为 [−231, 231 − 1]。请根据这个假设，如果反转后整数溢出那么就返回 0。 本人写法 /** * @param {number} x * @return {number} */ var
2020-11-30 20:50:48
186
原创 1370.LeetCode（上升下降字符串）——JavaScript
题目描述 给你一个字符串 s ，请你根据下面的算法重新构造字符串： 从 s 中选出 最小 的字符，将它 接在 结果字符串的后面。 从 s 剩余字符中选出 最小 的字符，且该字符比上一个添加的字符大，将它 接在 结果字符串后面。 重复步骤 2 ，直到你没法从 s 中选择字符。 从 s 中选出 最大 的字符，将它 接在 结果字符串的后面。 从 s 剩余字符中选出 最大 的字符，且该字符比上一个添加的字符小，将它 接在 结果字符串后面。 重复步骤 5 ，直到你没法从 s 中选择字符。 重复步骤 1 到 6 ，直
2020-11-26 13:29:11
151
原创 2.LeetCode（两数相加）——JavaScript
题目描述 原题链接 给出两个 非空 的链表用来表示两个非负的整数。其中，它们各自的位数是按照 逆序 的方式存储的，并且它们的每个节点只能存储 一位 数字。 如果，我们将这两个数相加起来，则会返回一个新的链表来表示它们的和。 您可以假设除了数字 0 之外，这两个数都不会以 0 开头。 输入：(2 -> 4 -> 3) + (5 -> 6 -> 4) 输出：7 -> 0 -> 8 原因：342 + 465 = 807 个人解法 + 分析 /** * Definition
2020-11-26 13:09:45
233
原创 1.LeetCode（两数之和）——JavaScript
题目描述 原题连接 给定一个整数数组 nums 和一个目标值 target，请你在该数组中找出和为目标值的那 两个 整数，并返回他们的数组下标。 你可以假设每种输入只会对应一个答案。但是，数组中同一个元素不能使用两遍。 示例: 给定 nums = [2, 7, 11, 15], target = 9 因为 nums[0] + nums[1] = 2 + 7 = 9 所以返回 [0, 1] 个人解法 + 分析 解法比较暴力 使用两层循环 /** * @param {number[]} nums * @
2020-11-24 19:19:45
215
原创 数据结构实验——表达式二叉树（ 以递归方式建立表达式的二叉树状结构，再分别输出前序 、中序及后序遍历结果，并计算表达式的结果。）
实验要求 实验实现语言 Javascript + HTML + CSS index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>表达式二叉树</title&g
2020-11-17 08:59:14
1514
原创 数据结构实验——年级学生成绩管理系统
实验需求 index.html <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
2020-10-24 12:35:48
667
1
原创 原生JS实现——flappy bird 像素小鸟 项目总结
项目展示 项目准备 images中所用到的图片 index.html 用一个 div 来 包裹游戏内容区域 <div id="game"> <!-- 小鸟div --> <div class="bird"></div> <!-- 开始游戏按钮 --> <div class="start start-white">开始游戏</div> <!-- 最上层分数 --> <di
2020-10-09 15:01:03
2033
2
原创 原生JS实现扫雷——项目总结
项目展示图 项目准备 一样的，我们先是准备出三个文件夹，以及根目录下的index.html 文件 然后是两张图片（地雷 和 旗子） 之后是html结构 html 首先是最外层的 游戏内容区域的div 取名id为mine <div id="mine"> </div> 之后是游戏内容区域中最上面的四个按钮，我们用四个button标签来表示，并且用一个div来包裹起来 并且给初级按钮一个最初的选中的样式 <div class="level"> &l
2020-09-22 19:30:58
773
1
原创 班级抽签小程序——项目总结
项目展示 项目中假设一个班只有三十个人 html结构 <div class="outerContainer"> <div class="question">请问你要抽几个xx班的小宝贝呢？</div> <div class="number"> <input type="text" style="color: #999;" value="请输入需要的人数" onblur="if (this.value == '')
2020-09-12 16:52:58
5220
1
原创 原生JS实现贪吃蛇——项目总结
项目准备 项目展示图 建立新文件夹，新建出images CSS JS 三个文件夹，并在根目录下创建出index.html 将下列素材图片转到images文件中 接下来可以开始着手操作了 HTML结构 游戏内容区域 （content） 游戏开始按钮 （btn startBtn） 游戏暂停按钮 （btn pauseBtn） 游戏进行区域 （snakeWrap） 可以构造出如下的结构 <div class="content"> <div class="b
2020-09-11 10:26:21
1652
原创 JavaScript(1)——基础语法部分（CSDN）
web 发展史 Mosaic，是互联网历史上第一个获普遍使用和能够显示图片的网页浏览器。于 1993年问世。 1994 年 4 月，马克.安德森和 Silicon Graphics（简称为 SGI，中译为“视算科技”或“硅 图”）公司的创始人吉姆·克拉克（Jim Clark）在美国加州设立了“Mosaic Communication orporation”。 Mosaic 公司成立后，由于伊利诺伊大学拥有 Mosaic 的商标权，且伊利诺伊大学已将技术转让给 Spy Glass 公司，开发团队必.
2020-09-02 08:59:31
873
自助点餐系统.zip
2020-07-24
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人