前端技术文章
-
- HTMLMessageChannel消息通道使用教程
- MessageChannel是JavaScriptAPI，需用newMessageChannel()创建配对端口port1/port2；端口单次传输、接收方必须调用start()才能收消息；跨上下文通信要求同源。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- 浏览器导出HTML5文件的实用方法
- 浏览器无法真正导出可运行的HTML5文件，只能保存静态HTML快照；要离线运行需用开发者工具复制完整DOM、手动处理资源路径，并通过本地服务器（如http-server）而非双击打开。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- flex-grow与flex-shrink区别详解
- flex-grow控制子元素扩展以填充剩余空间，值越大占比越大；flex-shrink决定空间不足时的压缩比例，值越大收缩越明显，二者配合实现灵活布局。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- 事件冒泡原理及阻止方法详解
- 事件冒泡是DOM事件从目标元素逐级向上传播至document的默认行为；可用event.stopPropagation()阻止，它仅停止冒泡而不影响同一元素其他监听器或默认行为。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- Outlook邮件链接无法打开？点击无反应解决方法
- 根本原因是系统未将Outlook设为默认邮件客户端，需在Windows设置或macOS系统设置中手动指定；同时mailto:链接须严格编码参数，避免空格、中文未转义，并注意旧版Outlook对长文本和cc/bcc的兼容限制。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- 防抖与节流：优化高频事件的两大利器
- 防抖是事件停止触发后延迟执行一次，适合搜索输入、窗口缩放；节流是固定间隔执行，适合滚动加载、拖拽更新；选择依据是“等停手再响应”用防抖，“持续但限频”用节流。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- CSS下拉菜单定位技巧：absolute与hover应用
- 使用CSS的position和:hover实现下拉菜单：通过父级li设置relative定位，子菜单absolute定位并默认隐藏，hover时显示，结合box-shadow、z-index等优化体验，无需JavaScript即可完成交互。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- HTML静音播放视频方法及移动端限制解析
- HTMLmuted属性在移动端不生效是正常现象，因其本质是绕过音频策略实现自动播放而非控制音量，必须配合autoplay和playsinline使用，且需在用户手势中调用play()。
- 文章 · 前端 | 2个月前 | 409浏览 收藏
-
- 元素拖拽吸附逻辑详解：getBoundingClientRect实战应用
- 关键在于每帧调用getBoundingClientRect获取被拖元素实时视口坐标，结合临界距离判断吸附时机，而非缓存初始值；需在dragover/mousemove中动态计算，确保边界处理稳定、反馈及时。
- 文章 · 前端 | 2个月前 | 409浏览 收藏