前端技术文章
-
- 正向断言实现高效格式校验技巧
- 正向肯定断言(?=...)的核心价值在于零宽度检查：不移动指针、不捕获内容，适用于多条件并列校验（如密码强度）和边界上下文约束（如JSON键名提取）。
- 文章 · 前端 | 4星期前 | 245浏览 收藏
-
- CSS调整弹性布局主轴方向的方法，主要是通过设置flex-direction属性。该属性决定了弹性容器内项目（flex items）的排列方向，即主轴的方向。flex-direction 属性值flex-direction 有以下几种常用取值：row（默认值） 主轴为水平方向，项目从左到右排列。row-reverse 主轴仍为水平方向，但项目从右到左排列。column 主轴为垂直方向，项目从上到下
- flex-direction唯一决定主轴方向，justify-content仅沿主轴对齐；设为column后justify-content控制上下对齐，而非左右；固定宽高需配合flex-basis或媒体查询适配方向切换。
- 文章 · 前端 | 4星期前 | 218浏览 收藏
-
- HTML下拉刷新能更新数据吗？
- HTML原生不支持下拉刷新，需用touch事件结合scrollTop判断顶部状态实现；pullDownAction中须控制加载态、安全更新数据源与DOM，并确保滚动上下文一致。
- 文章 · 前端 | 4星期前 | 202浏览 收藏
-
- 工厂模式与构造函数区别详解
- 工厂模式是普通函数，直接调用返回新对象，不依赖new且this无关紧要；构造函数需用new调用，通过this绑定属性方法，支持instanceof和原型继承。
- 文章 · 前端 | 4星期前 | 160浏览 收藏
-
- CSS无法直接选择父元素，但有替代方案
- CSS不能选择父元素因浏览器渲染机制限制，反向查找影响性能；可通过:has()伪类、结构调整或JavaScript间接实现。
- 文章 · 前端 | 4星期前 | 421浏览 收藏
-
- 原始字符串 length 属性与 Unicode 代理对的冲突，主要体现在字符串长度计算上。在 JavaScript 中，String.prototype.length 返回的是字符串中 16 位码元（code unit）的数量，而不是字符（code point）的数量。一、什么是 Unicode 代理对？Unicode 中的一些字符（如表情符号、某些特殊文字）需要使用 两个 16 位码元 来表示
- length统计UTF-16编码单元数而非字符数，导致代理对字符（如?、?）length为2；应使用Array.from()、Intl.Segmenter或codePointAt()获取真实字符数。
- 文章 · 前端 | 4星期前 | 493浏览 收藏
-
- CSS supports检测色彩空间兼容性
- color-mix()中使用lch()不报错而是被忽略，因旧版浏览器不支持lch()/oklch()；需用@supports(color:lch(0%00))检测并包裹，且混合色空间必须一致，fallback颜色须写在@supports外部以确保降级可靠。
- 文章 · 前端 | 4星期前 | 475浏览 收藏
-
- HTML中如何添加功能图标展示区域
- 最稳妥方案是直接在<summary>中嵌入带viewBox和title的inlineSVG，确保缩放清晰、颜色继承、无障碍语义完整且无网络请求。
- 文章 · 前端 | 4星期前 | 311浏览 收藏
-
- HTML5用JS替换背景图片方法
- 可通过五种方法动态修改background-image：一、直接设置style.backgroundImage；二、切换预定义CSS类；三、利用CSS变量setProperty；四、动态创建style标签注入规则；五、使用base64编码内联图像。
- 文章 · 前端 | 4星期前 | 107浏览 收藏
-
- 动态引入CSS文件，JS创建link标签方法
- 动态加载CSS应优先用link标签，需设rel="stylesheet"和href，避免仅依赖onload；并发插入要按层叠顺序严格控制；重复插入需查重；fetch+insertRule仅适用于小量规则且有诸多限制。
- 文章 · 前端 | 4星期前 | 375浏览 收藏
-
- 网页面包屑导航制作教程\_CSS伪元素添加分隔符
- 最稳方案是用.breadcrumb-item:not(:last-child)::after添加分隔符，避免+选择器失效和语义缺失；需设content、vertical-align:middle和line-height:1，小屏用content:""隐藏，确保响应式与无障碍兼容。
- 文章 · 前端 | 4星期前 | 389浏览 收藏
-
- 模块化Store跨模块数据共享技巧
- Pinia实现模块化数据共享的核心是通过storeToRefs保持响应式、$subscribe监听状态变更、defineStore抽离共享逻辑层，并谨慎使用$state跨模块写入。
- 文章 · 前端 | 4星期前 | 350浏览 收藏
-
- CSS媒体查询实现首行缩进自适应调整
- 用text-indent配合媒体查询可响应式调整缩进，但必须用em或rem单位；px和%在多断点下易失控，因缩进需随字号等比变化以保持中文排版语义，且须确保元素为块级并处于BFC中。
- 文章 · 前端 | 4星期前 | 277浏览 收藏
-
- CSS如何调整z-index解决输入框被遮挡
- z-index不生效的主因是元素未处于定位上下文中。CSS中z-index仅对position为relative、absolute、fixed或sticky的已定位元素有效，且受层叠上下文层级限制，需检查父容器是否创建了新的层叠上下文。
- 文章 · 前端 | 4星期前 | 224浏览 收藏
-
- TypeScript模板字面量实现强校验路由参数
- 模板字面量类型真正落地的价值在于编译期捕获路径参数类型错误并支持IDE自动提示合法路径；需结合条件类型+infer递归解析占位符，精确推导RouteParams为对象字面量而非Record，且须与useParams等Hook深度集成。
- 文章 · 前端 | 4星期前 | 374浏览 收藏
查看更多
课程推荐
-
- 前端进阶之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 工作流和沉淀团队常用智能体能力。
- 760次使用
-
- MELO音乐
- MELO音乐是一站式AI视频与音乐制作助手，对标suno, udio的高品质体验。提供伴奏生成、原创写词、无损导出、哼唱识曲、混音变声等全套音频与短视频编辑工具。无论是流行Kpop、电音说唱、民谣古风、摇滚儿歌还是商用轻音乐，MELO为你免费谱曲，轻松做同款！
- 768次使用
-
- UniScribe
- UniScribe 是一款 AI 音视频转文字与内容整理工具，支持上传音频、视频文件或粘贴 YouTube 链接，自动生成转写文本、摘要、思维导图和关键问题，并支持多格式导出，适合会议记录、课程学习、访谈整理和内容创作复盘。
- 723次使用
-
- 剧云
- 剧云是专业中文剧本创作平台，安全稳定运行十余年，集成AI编剧、剧本医生审核、人物小传、剧情关系图、大纲编写、多人协作、Word导入导出、版权管控功能，数据安全防护，轻松高效创作剧本。
- 919次使用
-
- 万象有声
- 万象有声，一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具，可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验，让有声书制作更简单！
- 879次使用
