ImageViewer.js：一个零依赖的现代化图片预览组件
🎯 引言
在当今的 Web 开发中，图片预览功能几乎是每个网站的标配。然而，大多数现有的图片预览库要么过于臃肿，要么依赖特定的前端框架，要么配置复杂。有没有一种方案，能够只需引入一个 JavaScript 文件，就能为网站添加完整的图片预览功能？
今天我要向大家介绍 ImageViewer.js - 一个真正意义上的零依赖、现代化图片 ...
全新AI增强Demo发布：DHTMLX Gantt与Diagram如何通过LLM更智能地构建项目与组织结构
作为近年来增长最快的技术领域之一，人工智能（AI）正改变企业在 Web 前端、项目管理和可视化领域的应用方式。DHTMLX 团队持续深耕 AI 能力，并积极探索如何将最新的 LLM（大语言模型）能力与其 JavaScript UI 组件进行深度融合。
DHTMLX 近日推出了 3 个全新 Demo，展示了 AI 如何显著提升 Gantt 甘特图与& ...
vxe-table 实现复制粘贴时，当粘贴时行数不够支持自动增加对应的行
vxe-table 实现复制粘贴时，当粘贴时行数不够支持自动增加对应的行，当粘贴数据时，如果粘贴的行数超过表格的行数，可以通过 clip-config.isRowIncrement 自动新增临时行
查看官网：https://vxetable.cn
gitbub：https://github.com/x-extends/vxe-table
gitee：https://gitee.com/x-extends/vxe-table
效果
代码
通过 cli ...
vxe-table 如何实现拖拽行数据排序，并对拖拽后进行提示框二次确认是否允许拖拽
vxe-table 如何实现拖拽行数据排序，并对拖拽后进行提示框二次确认是否允许拖拽，通过 row-drag-config.dragStartMethod 可以自定义处理拖拽开始时的拖动
查看官网：https://vxetable.cn
gitbub：https://github.com/x-extends/vxe-table
gitee：https://gitee.com/x-extends/vxe-table
效果
代码
通过 row-config.drag 和 ...
如何创建你的百Google度！！（实现双搜索引擎页面）
创建双搜索引擎页面
百Google度的网站被封了，但！！！这不影响我们创建属于自己的双搜索引擎页面！
提前准备
找到你想添加的俩个搜索引擎对应的URI 和 它预先定义用于存储搜索关键词的参数名。
打开你想要的搜索引擎的网页，在当前搜索引擎里输入“关键词”，点击搜索，然后观察上面的网址，一般“？”前出现的是对应的【 ...
JavaScript 基础笔记碎片-数据类型、变量与字符串操作
注意：本篇学习笔记摘录于原网站： JavaScript教程 - 廖雪峰的官方网站
笔记仅作学习留档使用
本篇目录
比较运算符
BigInt
变量
strict模式
字符串
多行字符串
模板字符串
操作字符串
比较运算符
JavaScript允许对任意数据类型做比较：
false == 0; // true
false === 0; // false
比较方式对比：
==：自动转换数据类型 ...
V8的垃圾回收器
垃圾回收算法
遍历 GC Root(window，DOM，栈等)标记活动对象和非活动对象
回收非活动对象所占据的内存
内存整理
新生代和老生代
在 V8 中，会把堆分成新生代和老生代两个区域
新生代通常只支持 1~8M 的容量，存放生存时间短的对象，由副垃圾回收器负责。
老生代通常容量很大，存放生存时间长的对象，由主垃圾回收器负责 ...
纯HTML + CSS + JS 实现Popup弹窗
在 Web 开发中，弹窗（Popup）是一种极其常见的交互组件，广泛用于：
表单提交确认
删除操作二次确认
登录/注册入口
信息提示或警告
虽然现在有大量 UI 框架（如 Element UI、Ant Design、Bootstrap）提供现成的弹窗组件，但理解其底层实现原理，不仅能让你在无框架环境下快速构建功能，还能加深对 DOM 操作、事件处理和 ...
前后端全栈技术栈深度剖析：从Vue到Node.js的完整学习路径
做了三年前端，发现自己还停留在"调用API"的层面？想突破瓶颈却找不到方向？本文从实际项目出发，梳理了前端进阶的关键技术节点：框架底层原理、全栈开发能力、工程化思维，以及那些面试官真正关心的技术深度。
📚 介绍
前端全栈技术体系深度解析
本技术资料系统梳理了现代Web前端开发的完整技术栈，适合有一定基础的开发 ...
为什么你的JavaScript代码总是出bug？这5个隐藏陷阱太坑了！
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
你是不是经常遇到这样的情况：明明代码看起来没问题，一运行就各种报错？或者测试时好好的，上线后用户反馈bug不断？更气人的是，有时候改了一个小问题，结果引出了三个新问题……
别担心，这绝对不是你的能力问题。经过多年的观察，我发现大多数JavaScript开发者都会掉进同样 ...
Web前端入门第 90 问：JavaScript 也能无中生有的创建音频
网页播放音乐这个常识应该都知道，毕竟百度 MP3 搜索可是风靡一时！
但使用浏览器无中生有的创建音频，在 HTML5 规范落地之前可是一片空白。
AudioContext 的体量与 Canvas 差不了多少，一个针对图形图像，一个用于音频，两者结合起来就把 flash 给拉下了神坛~~
本文源之于一次技术研究，曾经有一个需求要用 H5 搞一个网页 ...
vxe-table 实现根据单元格渲染的内容自动渲染成统计图、折线图、拼图等图表
vxe-table 实现根据单元格渲染的内容自动渲染成统计图、折线图、拼图等图表
效果
代码
<template>
<div>
<vxe-grid
v-bind="gridOptions"
@menu-click="menuClickEvent">
</vxe-grid>
</div>
</template>
<script>
export default {
data() {
const gridOptions = {
bor ...
JavaScript 中的 map、parseInt 与 NaN：一场关于类型转换与函数调用的深度解析
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
引言：一个看似简单的陷阱
在 JavaScript 的日常开发中，我们常常会遇到这样一段“经典”代码：
console.log([1, 2, 3].map(parseInt)); // 输出：[1, NaN, NaN]
乍看之下，这段代码似乎应该将字符串数组或数字数组转换为整数数组。然而，结果却出人意料——除了第一个元素外 ...
vxe-table 如何实现右键菜单异步权限控制
vxe-table 如何实现右键菜单异步权限控制，根据后端返回是数据结果来判断按钮选项是否禁用及是否显示。
使用 visibleMethod 在菜单显示时，可以精确到每一列每一行的显示隐藏与禁用控制，非常灵活，不过是同步还是异步都支持
查看官网：https://vxetable.cn
gitbub：https://github.com/x-extends/vxe-table
gitee：https:/ ...
Rachoon：基于 TypeScript 和 PostgreSQL 的自部署发票管理系统
每个月为发票管理工具付费？
其实你可以用一个开源项目，在自己的服务器上搭建发票系统，数据完全由自己掌控。
这是什么项目
Rachoon 是一个发票管理系统，专门给自由职业者和小团队用的。名字来自波斯尼亚语里"račun"这个词，就是发票的意思。
它能做这些事：
开发票和报价单
记录客户信息
跟踪哪些钱收到了 ...
JavaScript性能优化：我从50ms降到5ms的7个关键技巧
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
引言
在现代Web开发中，性能优化是一个永恒的话题。随着前端应用的复杂度不断提升，JavaScript的执行效率直接影响用户体验。我曾面临一个关键功能的性能瓶颈——初始实现需要50ms完成的任务，通过一系列优化手段成功降至5ms。本文将分享这7个关键技巧，涵盖从代码层面到运行时 ...
精美的vue流程设计器
一、vue-dawn-flow介绍
vue-dawn-flow是一款功能强大的开源流程设计器，专为 Vue.js 生态打造，完美兼容 Vue 2 和 Vue 3 框架。并且能很好的兼容vue前端所有框架。
1.1插件功能
提供了一个可视化的流程设计器，你可以在设计器中拖拽组件，连接组件，设置组件属性。
提供了多种节点类型可共筛选。
提供了节点的相关操作，比 ...
精美的Vue可视化流程设计器
一、前言
该流程设计器（vue-dawn-flow）兼容任何vue前端框架，如element ui 、element plus 、Ant Design Vue、Naive UI等。
开箱即用，完全开源。
该流程设计器提供了api、属性、事件、方法等适用功能。
二、使用方式
选择1 npm i vue-dawn-flow
选择2 yarn add vue-dawn-flow
三、文档地址
文档地址：http://1 ...
20251107
每次写类的时候都会觉得发明面向对象的人真是个天才。
今天晚上又稍微写了点，增加了碰撞伤害，现在玩家碰到怪物会回扣怪物.at血量并进入一秒的无敌状态，并且自身颜色变为白色，也是第一次体会到异步的方便之处吧。
更新后代码如下：
1 <!DOCTYPE html>
2 <html lang="en">
3
4 <head>
5 <meta charset="UTF ...
前端工程化中Less第三方库中@Import的“~”和“@”用法
在前端工程化开发中经常会用到less第三方css库，其中@import指令中的~符号和@符号用于指定模块化路径，常见于Webpack等构建工具中。下面介绍使用方法：
路径解析规则：
~符号：表示模块请求，构建工具会将其解析为node_modules目录或配置的别名路径 。
@符号：通常指向项目源码根目录（如src），具体由项目配置决定 ...
