- 博客(39)
- 资源 (2)
- 收藏
- 关注
原创 javascript经典练习题-语法与特性
下面这段精心整理的内容,呈现了一系列丰富多样的练习题集,它们专注于JavaScript编程语言的两个核心方面——语法和特性。这些练习题旨在帮助学习者系统地巩固基础知识,并在实践中不断提升他们的JavaScript编程技能,从而为进一步探索和运用这门强大的编程语言奠定坚实的基础。
2025-02-28 18:09:05
365
原创 JavaScript数据结构-Set的使用
在 JavaScript 中,Set 是 ES6 引入的一个新数据结构,它允许我们存储一组唯一的值。这使得 Set 成为许多场景下的理想选择,特别是当我们需要对数组进行去重操作时经常被提起和使用。
2025-02-28 14:01:54
754
原创 javascript经典练习题-数组篇
要求数组中的每个元素向右“移动”指定的次数。比如,给定 [1, 2, 3, 4, 5],右移 2 次后数组应变成 [4, 5, 1, 2, 3]描述:给定一个数组以及一个目标值,需要从该数组中找出所有两数之和等于目标值的数对,并以二维数组的形式输出这些符合条件的数对。描述:素数是指大于1的自然数,除了1和它本身外,不能被其他自然数整除的数。例如[1, [2, [3, 4]]]转为[1, 2, 3, 4]。描述:取交集的意思是找出两个数组中都存在的元素,并且确保最终结果中的每个元素都是唯一的。
2025-02-28 11:26:15
191
原创 浏览器控制台console命令详解
在Web开发的过程中,合理且巧妙地运用console方法,就如同为我们的开发之旅点亮了一盏明灯,能让我们在复杂多变的代码世界中拥有更好的调试体验。通过充分利用console提供的各种功能,我们能够更加深入、细致地观察程序的运行状态,及时发现并解决潜在的问题,从而提升开发效率,优化代码质量,为打造更加优质、稳定的Web应用奠定坚实的基础。
2025-02-26 17:41:09
2011
原创 JavaScript算法-合并两个有序链表
如果l1是null(即空链表),那么函数直接返回l2。空间复杂度:O(M + N),在最坏的情况下(当链表完全不平衡时),因为递归调用栈的深度可能达到M + N。时间复杂度:O(M + N),每个节点都只被访问一次,并且每次递归调用都会处理一个节点。使⽤递归的方式来实现,将两个链表头部较⼩的⼀个与剩下的元素合并,并返回排好序的链表。比较l1和l2当前节点的值(l1.val和l2.val)。同样,如果l2是null,函数返回l1。头,当两条链表中的⼀条为空时终⽌递归。M、N 是两条链表 l1、l2 的⻓度。
2025-02-26 14:01:28
428
原创 JavaScript数据结构-模拟链表
链表作为一种基础且重要的线性数据结构,在数据处理领域发挥着独特作用,尤其在应对频繁的插入与删除操作时展现出显著优势。深入了解并熟练掌握链表的基本操作以及更为复杂的进阶操作,能够为解决各类实际问题提供有力的支持。
2025-02-25 17:50:43
602
原创 javascript数据结构与算法
数据结构:数据的组织形式,如数组、链表、树、图等,用于高效存储和访问数据算法:解决问题的步骤,是指令的有限序列,其中每条指令表示一个或多个操作。它具备有穷性(有限步骤内完成)、确定性(每一步都有确切含义)、可行性(能通过有限次操作实现)等基本特性数据结构为算法提供了操作的对象和基础,而算法则通过操作这些数据结构中的数据来实现特定的功能和性能要求
2025-02-25 16:32:04
959
原创 解决element-ui的el-select使用filterable属性时,下拉框展开后,点击箭头图标收不回去问题
问题:当el-select下拉组件设置filterable属性时,下拉框展开后,再点击箭头图标下拉框收不回去了。在el-select标签上新增事件 @visible-change=“selectVisibleChange” @focus="selectFocus"的处理。
2025-02-20 15:21:39
344
原创 git-使用git stash命令解决拉取代码时存在冲突导致拉取失败问题
在很多时候我们拉取代码时,会存在代码冲突导致拉取失败,这种情况下如果我们直接去修改代码那就太麻烦了。我们可以使用和两个命令巧妙的解决这个难题,它们主要用于临时保存和恢复工作进度。
2025-02-20 11:59:28
1086
原创 JavaScript网页设计8个经典案例
以上这些JavaScript案例涵盖动态效果、交互功能等等,便于提升用户体验,为开发者提供学习资源。同时在实际项目中扩展和优化,能助力网页设计更上一层楼。
2025-02-08 17:19:19
725
原创 解决Element UI中el-select下拉框因为选项内容过长导致下拉框宽度显示过长问题
在使用el-select下拉框时,当选项的内容过长就会自动撑开下拉框容器,导致下拉框的宽度显示异常,影响页面美观我们更倾向于下拉框的宽度和el-select组件宽度保持一致。
2025-02-08 14:37:05
801
原创 websocket使用
WebSocket 是一种适用于 Web 浏览器与服务器的全双工通信协议,支持网页实时收发数据,无需刷新页面或采用传统 HTTP 轮询机制,确保浏览器与服务器间连接稳定。该特性使其广泛应用于聊天应用、实时数据监控等领域,为实时交互提供高效解决方案。
2025-02-07 09:39:21
646
原创 解决ElementUI中el-radio使用报错问题:Blocked aria-hidden on an element because its descendant retained focus
查找资料发现:这个警告信息是由于 aria-hidden 属性和焦点管理冲突导致的。在 Element UI 的 el-radio 组件中,标签被设置为 aria-hidden=“true”,但同时其子元素(如 <input>)仍然保留了焦点,这会导致辅助技术(如屏幕阅读器)无法正确识别焦点状态,就会触发此警告。这比aria-hidden="true"更合适,因为它不仅隐藏了元素,还阻止了它们的交互。检查 el-radio 组件或其父元素是否被错误地设置了 aria-hidden=“true”。
2025-02-06 16:58:45
1520
原创 前端实现图片压缩插件(image-compressorionjs)
在Web开发中,图片压缩是一个常见的需求。随着高清图片和多媒体内容的普及,平衡图片质量与文件大小对提升网页加载速度和优化用户体验至关重要。这里我们使用插件进行图片压缩。
2024-12-26 13:53:47
539
原创 vue项目env文件的使用(vue cli2和vue cli3)
在 Vue CLI 2 中,需要安装 dotenv 包来加载和使用环境变量。:首先安装 dotenv 包:在项目的根目录下创建一个 .env 文件,并在其中定义你的环境变量。:现在你可以在代码中使用 process.env.YOUR_ENV_VAR 来访问你在 .env 文件中定义的环境变量。
2024-12-04 11:31:47
777
原创 vue-virtual-scroller插件实现不等高表格虚拟滚动
这是因为vue-virtual-scroller插件使用了超过浏览器理解的js代码,需要转换为旧版es5规范的代码浏览器才能正常执行。对于大量的表格数据加载,如果我们全部加载不仅面临加载等待时间长,容易崩溃的问题,还有可能导致浏览器缓存数据量大而导致页面使用卡顿的情况。在页面中使用,不等高的列表需要使用DynamicScroller+DynamicScrollerItem这种方式。加载来优化这种情况,在这里我们使用插件vue-virtual-scroller来实现虚拟滚动。使用过程中可能存在的问题。
2024-09-02 12:00:17
1754
原创 JS实现高度不等的列表虚拟滚动加载
而为了后续的一些针对列表的操作,例如直接查看第666行的数据,就需要对这行的数据有清楚的定位信息,且确保跳转后再次上下滚动加载不会导致出现问题(白屏情况),所以需要实时更新之前的布局信息以供这种操作。加载成功后就需要设置滚动条,为了后面滚动加载其他的内容,我们使用padding撑开盒子的高度,而padding的值就根据缓存的rowPosList每一元素的布局信息来设置。根据需要加载的开始位置和结束位置,加载虚拟滚动页面的内容,默认加载从第一行开始的数据。,即滚动列表时,动态改变可视区域内的渲染内容。
2024-09-02 10:24:45
839
原创 使用node.forge.js加密传输
很多时候我们与后台的交互数据需要保证安全性,这个时候就需要将传给后台的数据进行加密,这里我们使用node.forge.js进行加密传输。:Node-forge可以在多种环境中使用,包括服务器端(如Node.js)和客户端(如浏览器中的JavaScript)。:Node-forge提供了清晰的接口文档和丰富的示例代码,使得开发者即使没有深厚的加密知识背景也能够快速上手和使用这些加密技术。:例如,它支持公钥和私钥的生成,以及基于这些密钥的加密和签名操作。或者使用 npm i node-forge -s 安装。
2024-05-21 17:24:37
1311
原创 vue-cli2项目中使用scss
首先要搞清楚Sass和Scss的区别:实际上Sass和Scss是同一种东西,Scss是 Sass3 引入新的语法,它们都是css预处理器。:Sass 默认使用“.sass”作为文件扩展名,而 Scss 使用“.scss”作为扩展名。:Sass 最初是以严格的缩进式语法规则来书写,不带大括号和分号,这种方式使得代码更加简洁,但在某些情况下可能不如Scss直观易读;相比之下,Scss的语法允许使用大括号和分号,与常规的 css语法相似,这使得 Scss更容易被 css开发者接受和使用。
2024-05-21 15:42:53
1121
原创 网页微信扫码登录,以及redirect_uri参数错误解决方案
流程:首先是生成二维码,二维码对应的 url 中包含一个回调地址,在用户同意授权之后,将会在你的回调 url 上拼接参数 code 并且跳转,跳转之后前端从 url 中获取 code,调用接口发送给后端,后端用 code 去获取所需要的信息即可二维码效果扫码页码用户授权确认后,会跳转到之前redirect_uri属性写的链接,且带着code值。在跳转之后前端从 url 中获取 code,调用接口发送给后端,后端用 code 去获取所需要的信息即可。
2023-12-22 17:12:52
4565
原创 vue/cli3项目兼容ie(转为es5)
因为做的项目会在IE环境下运行的情况,按正常vue支持来说,IE8+应该是支持的,可是ES6写法需要进行兼容,否则项目在IE中无法打开,空白,也报一些 未定义什么的错误。
2023-12-19 14:30:30
1461
1
原创 理解js事件循环机制Event Loop(宏任务和微任务)
JavaScrip是单线程的,也就意味着同一时间只能处理一件事,如果其中一件事运行非常耗时,就会阻塞线程,事件循环机制就是解决这件事的
2023-12-18 16:24:14
1164
原创 【vue】解决element-ui的el-select下拉框中因选项内容太长导致容器宽度过长问题
使用el-select下拉组件时,当下拉框中的选项内容很长会自动撑开容器宽度,导致页面效果很不好。如果不想使用组件默认的样式效果(超出的文字隐藏,并且后面添加省略号)属性设置下拉弹出框自定义类型 customDropdown。想使用横向滚动条展示所有内容,可以再加上下面的样式代码。为false:不将下拉弹出框插入至 body 元素。1、首先设置el-select的属性。3、设置下拉框的宽度。
2023-12-07 16:17:09
7774
1
原创 vue+pdf.js预览本地pdf文件(可以复制文本,滚动页码展示)
3、解析pdf,获取pdf所有页数据,使用canvas渲染,并使用TextLayerBuilder创建文本层,可以复制文本信息。在这里就是因为微任务导致,所以我们这里渲染pdf任务可以每次渲染完一页后等待一定时间才执行下一页的渲染,空出时间给主线程。在渲染pdf数据时,当pdf文件很大渲染量很多时,会导致页面卡住,无法执行其他操作;在滚动时当前是第几页的页码同步更新展示:需要在渲染每页pdf时将每页的高度存起来,以及每页滚动的临界值。在滚动时,根据当前滚动距离和每页滚动的临界距离相比较,判断当前是第几页。
2023-12-05 16:26:17
6296
3
原创 以鼠标为中心缩放图片
初始鼠标位置距离图片左侧的left、top和宽高的比例,与图片放大后的比例相同计算方式,主要是知道放大后鼠标的位置和放大前鼠标的位置,相减得到偏移的距离,使用transform:translate移动就行。在这个基础上不管是缩小还是放大,都需要把上一次translate对应坐标的值 - 这次得到的值
2023-12-04 18:13:08
984
原创 js+html2canvas实现网页放大镜效果:放大镜图片使用css样式background背景图,鼠标移动使用样式background-position动态设置
鼠标移动到需要放大的网页上时,鼠标静止不动500毫秒后,一个长方形的放大镜框显示,放大镜中显示当前区域2.2倍的效果,并且这时候鼠标移动放大的区域也跟着变化。放大镜限制:放大镜只能在特定的区域内使用,即放大镜的移动范围有边界。
2022-08-31 18:09:45
2278
1
原创 js 复制指定元素内的文本信息到剪切板(navigator.clipboard和document.execCommand)
【代码】js 复制指定元素内的文本信息到剪切板。
2022-08-26 15:41:20
1203
原创 循环使用正则时,属性lastIndex导致输出结果与实际情况不符合
问题复现const reg = /\.png$/igconst arr = ['1.png','2.png', '3.png']arr.forEach(i=>{ console.log('匹配结果:'+reg.test(i))})结果会是这样很明显,和预期的结果不一致,结果应该都是true产生原因在正则表达式使用了表示全局检索的 “g” 标志时,正则的lastIndex属性会记录上一次的匹配字符的index+1(lastIndex),下一次匹配时就会从lastIndex处为
2022-04-02 16:05:56
224
原创 VS code断点调试vue项目代码
1、搜索安装 debugger for chrome 插件2、创建launch.json文件点击运行和测试,或下面的创建文字按钮,选择chrome3、修改launch.json文件 的配置项{ // 使用 IntelliSense 了解相关属性。 // 悬停以查看现有属性的描述。 // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "conf
2022-03-09 15:23:19
2945
原创 js数组去重的方法
js数组去重的方法1、for嵌套for,使用splice删除原数组重复的元素2、indexOf方法去重,返回新数组3、includes方法去重,返回新数组4、利用对象key属性唯一的特性去重4、利用ES6中的Set去重1、for嵌套for,使用splice删除原数组重复的元素 function deleteRepetition(arr){ for (let i = 0; i < arr.length; i++) { for (let j = i + 1; j <
2022-03-02 17:33:42
277
原创 判断一个字符串中出现次数最多的字符,并统计次数
var str = "acfdskffdssfaf"var obj = {}for (let i = 0; i < str.length; i++) { if (obj[str[i]]) { obj[str[i]]++ } else { obj[str[i]] = 1 }}console.log(obj)var maxNum = 0, maxStr = str[0]for (const item in obj) { if (o
2020-08-29 15:14:59
304
原创 Vue如何自定义一个组件
具体步骤如下:1、在compoents文件夹下创建mine文件夹,在其中创建Mine.vue和index.js;2、Mine.vue代码如下:<template> <div> <h3>自定义组件</h3> <p>{{msg}}</p> </div></template><script>export default { name: '
2020-08-09 16:53:19
382
原创 使用swiper.js插件实现简单的动画
1、首先引入css和js文件 <link rel="stylesheet" href="./cssC/swiper-4.5.0.min.css"/> <script type="text/javascript" src="./script/swiper-4.5.0.min.js"></script>2、根据需求编写样式和布局图片css样式: /* 轮播 */ .lunbo{ width: 100%; height:5.7rem;
2020-06-27 23:37:54
364
express+websocket+vue实现简单的对话聊天系统
2025-02-17
javascript经典案例.zip
2025-02-10
javascript+canvas+vue实现多种模式的图片压缩网站
2025-02-10
vue+pdf.js预览本地pdf文件(可以复制文本,滚动页码展示)
2024-06-06
node-forge.js加解密文件
2024-05-21
20多种常用的正则表达式
2023-12-07
mysql增删改查常用语句(包含复杂场景)
2022-09-13
git常用命令大全.md(包含异常情况的处理)
2021-09-06
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人