前端技术文章
-
- JavaScript读取LocalStorage技巧
- 从LocalStorage读取数据使用localStorage.getItem()方法，需注意数据类型转换、错误处理、数据完整性、性能和安全性。1.使用localStorage.getItem()读取数据。2.存储的对象或数组需用JSON.parse()转换。3.进行错误处理防止JSON.parse()抛出错误。4.添加版本控制或校验和确保数据完整性。5.注意性能和安全性问题，避免存储敏感信息。6.设计健壮系统处理数据丢失，使用默认值或从服务器重新加载数据。
- 文章 · 前端 | 8个月前 | 500浏览 收藏
-
- CSS表格行高平滑过渡技巧
- 使用max-height是实现表格行高过渡最实用的方法，通过设置max-height过渡并配合overflow:hidden，可在hover或点击时模拟内容展开动画，解决tr无法直接过渡height的问题。
- 文章 · 前端 | 8个月前 | CSS Transition max-height 表格行高过渡 tr 500浏览 收藏
-
- IP地区访问限制设置教程
- 答案：表单IP或地区访问控制需在服务器端实现，通过获取用户真实IP并结合黑白名单或地理定位进行过滤，同时应配合验证码、速率限制等多层安全措施以提升整体安全性。
- 文章 · 前端 | 8个月前 | 500浏览 收藏
-
- HTML视频无法加载？onerror处理全攻略
- 视频加载失败时可通过onerror事件捕获并处理，如显示备用封面、提示信息或切换备用源，结合多格式支持与路径检查可有效提升兼容性与用户体验。
- 文章 · 前端 | 8个月前 | 500浏览 收藏
-
- ArrayBuffer与TypedArray的二进制处理优势解析
- ArrayBuffer和TypedArray更高效，因其直接操作连续的原始二进制内存，避免了普通数组的对象开销和类型动态性；TypedArray提供固定类型的视图，实现无装箱/拆箱的快速访问；配合WebGL、Fetch等WebAPI零转换交互，并支持共享内存与零拷贝优化，显著提升音视频、游戏等高性能场景下的数据处理效率。
- 文章 · 前端 | 8个月前 | 500浏览 收藏
-
- CSS等间距布局怎么实现？Flexbox和Grid用gap设置间距
- gap属性是实现CSS等间距布局最直接优雅的方式，尤其在Flexbox和Grid中，它通过一行代码即可统一设置项目间间距，避免了传统margin带来的边距叠加、末元素多余间距等问题，无需额外选择器或负边距处理；在响应式设计中，可结合媒体查询灵活调整不同屏幕下的行与列间距，提升维护性和可读性；在多行Flex容器中，gap能清晰分离行与列间距，但需注意flex-direction对“行”“列”方向的影响以及容器边缘无间距的特性，整体上极大简化了布局逻辑，是现代CSS布局的首选方案。
- 文章 · 前端 | 8个月前 | FLEXBOX Grid margin gap 等间距布局 500浏览 收藏
-
- 多租户SaaS后端设计详解
- 多租户SaaS后端需实现数据隔离、租户识别、权限控制与可扩展架构。1.数据隔离可选独立数据库、共享库独立Schema或共享表加tenant_id，按安全与成本需求权衡；2.租户通过域名、JWT或请求头识别，并将上下文绑定至请求链路；3.认证时校验租户状态，采用RBAC模型实现租户内角色权限及平台管理员跨租户管理；4.微服务拆分功能模块，各服务具备租户感知能力，缓存Key、消息事件和定时任务均需包含租户标识，确保数据不越界。核心是租户上下文贯穿全流程，保障隔离与安全。
- 文章 · 前端 | 8个月前 | 500浏览 收藏
-
- CSS多行文本溢出隐藏技巧
- line-clamp是前端实现多行文本截断的核心方案，通过-webkit-box、-webkit-line-clamp和overflow:hidden组合限制行数并显示省略号，适用于新闻、商品等摘要场景；其兼容性在现代浏览器中良好，但需注意-webkit前缀，旧版浏览器可采用JavaScript动态计算截断或单行white-space+text-overflow方案；使用时需避免与固定height冲突，注意在Flex/Grid布局中的对齐问题，并结合媒体查询适配响应式设计；通过JS控制类名切换可实现“展开
- 文章 · 前端 | 8个月前 | 500浏览 收藏
-
- CSS实现侧边栏滑动菜单效果
- 要实现滑动侧边栏，核心方法是使用CSS的transition与transform属性配合JavaScript控制状态。1.HTML结构包括侧边栏、主内容区域和遮罩层；2.CSS通过transition实现平滑动画，transform提升性能，overflow隐藏溢出内容，box-shadow增加层次感；3.JavaScript控制类切换以实现打开/关闭逻辑，并支持点击遮罩或关闭按钮关闭菜单。纯CSS方案可行但有局限：依赖checkbox实现，缺乏对点击外部关闭、键盘操作和复杂状态的支持。关键CSS属性包括
- 文章 · 前端 | 9个月前 | 500浏览 收藏
-
- JavaScript属性描述符技巧全解析
- 使用writable:false可创建只读属性，防止修改，适合常量；2.设置enumerable:false使属性不可枚举，隐藏于Object.keys()；3.通过get/set实现数据校验与计算，避免直接读写导致递归。
- 文章 · 前端 | 9个月前 | 500浏览 收藏
-
- JavaScript计算节点深度的实用方法
- 本文详细介绍了在JavaScript中计算非二叉树节点深度（或层级）的两种递归方法。通过构建具有名称和子节点数组的通用树结构，教程演示了如何从根节点向下搜索目标节点，以及如何从目标节点向上追溯至根节点来确定其深度。文章提供了清晰的代码示例、详细的递归逻辑解析及使用注意事项，旨在帮助开发者高效地处理树形数据。
- 文章 · 前端 | 9个月前 | 500浏览 收藏
-
- CSS精准控制盒子宽高技巧
- 使用box-sizing:border-box可精确控制尺寸，width和height包含content、padding和border，避免因标准盒模型中padding和border额外增加导致溢出，结合max-width、min-height等实现响应式布局。
- 文章 · 前端 | 9个月前 | 500浏览 收藏
-
- CSS动画优化滚动交互技巧
- 答案：通过“JS触发，CSS执行”策略优化滚动动画，利用IntersectionObserverAPI检测元素可见性，JavaScript添加类名触发CSS动画，优先使用transform和opacity等GPU加速属性，避免重排重绘，提升性能并实现流畅交互动画。
- 文章 · 前端 | 9个月前 | CSS动画 滚动交互 500浏览 收藏
-
- 可展开部件实现技巧全解析
- 实现可展开部件需结合HTML结构、CSS动画与JavaScript交互，核心是通过JavaScript切换类名控制内容区域的显示状态，利用max-height和transition实现平滑动画，同时注重ARIA属性、键盘导航与语义化标签以提升无障碍访问体验。
- 文章 · 前端 | 9个月前 | JavaScript CSS动画 无障碍访问 max-height 可展开部件 500浏览 收藏
-
- HTML中没有past伪类，正确是visited，用于设置已访问链接样式。
- 没有::past伪类，但可通过JavaScript添加如is-completed类，结合CSS定义“过去”状态样式，实现多步骤流程或任务列表的视觉区分。
- 文章 · 前端 | 9个月前 | 500浏览 收藏
查看更多
课程推荐
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案，代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景，打造一站式知识长龙服务，适合有JS基础的同学学习。
- 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例，全面具体可落地，从理论到实践，一步一步将GO核心编程技术、编程思想、底层实现融会贯通，使学习者贴近时代脉搏，做IT互联网时代的弄潮儿。
- 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信：Le-studyg；在课程中，我们将首先介绍MySQL8的新特性，包括性能优化、安全增强、新数据类型等，帮助学生快速熟悉MySQL8的最新功能。接着，我们将深入解析MySQL的网络通信机制，包括协议、连接管理、数据传输等，让
- 500次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网，分为导航，轮播，关于我们，成功案例，服务流程，团队介绍，数据部分，公司动态，底部信息等内容区块。网站整体采用CSSGrid布局，支持响应式，有流畅过渡和展现动画。
- 485次学习
-
- Golang深入理解GPM模型
- Golang深入理解GPM调度器模型及全场景分析，希望您看完这套视频有所收获；包括调度器的由来和分析、GMP模型简介、以及11个场景总结。
- 474次学习
查看更多
AI推荐
-
- ljg-skills
- ljg-skills 是李继刚开源的 AI 技能与提示词集合，面向大模型使用者整理了一批可复用的 prompt、角色设定和任务技能模板，适合用于学习提示词设计、搭建个人 AI 工作流和沉淀团队常用智能体能力。
- 2704次使用
-
- MELO音乐
- MELO音乐是一站式AI视频与音乐制作助手，对标suno, udio的高品质体验。提供伴奏生成、原创写词、无损导出、哼唱识曲、混音变声等全套音频与短视频编辑工具。无论是流行Kpop、电音说唱、民谣古风、摇滚儿歌还是商用轻音乐，MELO为你免费谱曲，轻松做同款！
- 2501次使用
-
- UniScribe
- UniScribe 是一款 AI 音视频转文字与内容整理工具，支持上传音频、视频文件或粘贴 YouTube 链接，自动生成转写文本、摘要、思维导图和关键问题，并支持多格式导出，适合会议记录、课程学习、访谈整理和内容创作复盘。
- 2442次使用
-
- 剧云
- 剧云是专业中文剧本创作平台，安全稳定运行十余年，集成AI编剧、剧本医生审核、人物小传、剧情关系图、大纲编写、多人协作、Word导入导出、版权管控功能，数据安全防护，轻松高效创作剧本。
- 2675次使用
-
- 万象有声
- 万象有声，一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具，可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验，让有声书制作更简单！
- 2619次使用
