通常在页面中嵌套iframe的情况下还需要进行消息传递的通信需求。一般分为两种情况： 1.iframe里的链接与父页面链接是非跨域 这种情况处理比较简单，直接在父级页面下就可以写脚本控制iframe里的元素，同时对iframe里的元素进行操作，例如绑定事件，当事件触发时发送消息给父级页面。 具体实践 ...

索引签名是 TypeScript 中一个强大的特性，它允许我们在对象和类中使用动态的属性名称。通常情况下，我们会在对象或类中定义固定的属性，但有时我们需要处理具有动态属性名称的情况。这时，索引签名就派上了用场。 在这篇技术博文中，我们将介绍索引签名的使用方法和用例，将展示如何定义带有索引签名的接口... ...

# Electron-builder打包和自动更新 # 前言 文本主要讲述如何为 electron 打包出来软件配置安装引导和结合 github 的 release 配置自动更新。 electron-builder 是将 Electron 工程打包成相应平台的软件的工具，我的工程是使用 [elect ...

最近翻到 ElementUI 的日期组件源码，看到一些处理日期的工具方法，挺有意思，平常没有注意到，特此记录下来。 ### 获取当前日期的前一天，后一天 ```js export const prevDate = function(date, amount = 1) { return new Dat ...

# 前言 提到爬虫可能大多都会想到python，其实爬虫的实现并不限制任何语言。 下面我们就使用js来实现，后端为express，前端为vue3。 # 实现功能 话不多说，先看结果： ![image](https://img2023.cnblogs.com/blog/1769804/202308/1 ...

当我们疲于开发一个接一个的需求时，很容易忘记去关注网站的性能，到了某一个节点，猛地发现，随着越来越多代码的堆积，网站变得越来越慢。本文就是从这样的一个背景出发，着手优化网站的前端性能，并总结出一套开发习惯，让我们在日常开发时，也保持高性能，而不是又一次回过头来优化性能。 ...

### 1.websocket介绍 > WebSocket协议是基于TCP的一种新的网络协议。它实现了浏览器与服务器全双工(full-duplex)通信——允许服务器主动发送信息给客户端。websocket 协议是在 http 协议上的一种补充协议，是 html5 的新特性，是一种持久化的协议。 # ...

因历史遗留原因，接手的项目没有代码提醒/格式化，包括 eslint、pretttier，也没有 commit 提交校验，如 husky、commitlint、stylelint，与其期待自己或者同事的代码写得完美无缺，不如通过一些工具来进行规范和约束。 ### eslint eslint 是一个代码 ...

 在现代的 Web 开发中，使用 OpenAPI（以前称为 Swagger）规范来描述和定义 API ...

# DOM事件 1.DOM中的事件可以分为两类 - 1.浏览器行为 如：文档加载完成，图片加载完成 - 2.用户行为 如：输入框输入数据，点击按钮 (2).常见的DOM事件 ```bash onload 浏览器已完成页面的加载 支持事件的对象 window image onchange HTML 元 ...

节流和防抖是前端开发中常用的优化技术，主要用于优化一些高频触发的事件。 节流会直接丢掉后面的操作，防抖就是合并操作 ...

ScrollTrigger是一个功能强大的JavaScript插件，用于创建令人惊叹的滚动交互效果。它可帮助前端开发者轻松实现页面元素的逐步加载、动态视差效果、无限滚动和触发式动画等炫酷的特效。通过简单而灵活的API，我们可以定义滚动位置、触发事件和动画效果的完美时机，从而为用户提供流畅且吸引人的浏... ...

在JavaScript语言里有个 Math.random() 随机函数，用于生成指定范围内的随机数。 #### Math.random()函数 根据官方的定义: **Math.random()** 函数返回一个浮点数, 伪随机数在范围[0，1)，也就是说，从0（包括0）往上，但是不包括1（排除1）， ...

一、js有如下：1、string类型；2、number类型；3、boolean类型；4、null类型；5、undefined类型；6、Object类型；7、Array类型；8、Function类型；9、Symbol类型。共九种数据类型。js把数据类型分为“基本数据类型”和“引用数据类型”。其中6、7 ...

防抖函数和节流函数是工作中两种常用的前端性能优化函数，今天我就来总结一下什么是防抖和节流，并详细说明一下如何在工作中应用防抖函数和节流函数 ...

1.查看分支 查看本地分支 git branch 查看远程分支 git branch -r 查看本地和远程分支 git branch -a 2.创建分支 使用以下命令创建一个本地分支 git branch <本地分支名> 使用以下命令创建一个本地分支且新建分支从特定分支拉取代码 git branch ...

问题描述：初始化渲染后 tabs的下划线没有居中对其，出现异位。 问题分析: 网上很多大佬分析过出现原因了 记录下解决的过程: 在各个论坛搜集到解决方案都暂时无效 有使用v-if重新渲染的 有给类赋值偏移值的 有强行转换px的 因为各种原因这些方法在自己身上没有奏效所以记录下自己解决方案 偏移问题会 ...

"vue-drag-resize" 是一个基于 Vue 框架的拖拽和调整大小插件。它提供了简单而灵活的API，使开发者能够轻松实现元素的拖拽和调整大小功能。通过 "vue-drag-resize"，您可以让用户按需拖拽和调整大小各种页面元素，如窗口、图像、卡片等。该插件还支持限制元素的移动范围和尺寸... ...

### 1. 使用箭头函数简化函数定义 ```cobol // 传统函数定义 function add(a, b) { return a + b; } // 箭头函数简化 const add = (a, b) => a + b; ``` ### 2. 使用解构赋值简化变量声明 ```cobol // ...

项目开发中，用到Chart.js展示图表，用起来也非常方便，配置很灵活，很好用，给个数据集，设置一些配置值，实例化一个Chart出来，图表就非常丝滑地展现出来了。 但是作为开发人员都知道的一个真理，永远不变的就是变化，永远无理的都是客户的需求。 很不幸，我就撞到这么一个的需求：“把那些值为0的数据集 ...