-
MDNWebDocs是最值得优先打开的HTML教程入口,因其提供权威、实时、兼容性明确的一手查证依据;freeCodeCamp以项目驱动培养真实工作流意识;应避开罗列冷门废弃标签的教程,聚焦高频易错点;HTML学习需与CSS、JS协同实践。
-
纯CSS响应式多级菜单需桌面端用:hover+:focus-within、移动端禁用:hover改用data-open或:focus-within;二级菜单不显示主因是父li缺position:relative且子菜单误用visibility/opacity隐藏而非display:none。
-
流式二进制合并适用于满足全部前提的碎片化媒体:同源、未加密(或已解密)、编码参数一致、首片含完整文件头且后续为纯帧数据;否则需转码、解密或转封装。
-
HttpOnly是服务端在Set-Cookie中声明的标志,禁止JavaScript访问Cookie,从而防止XSS成功后盗取sessionid;需配合Secure(仅HTTPS传输)和SameSite(防CSRF)才完整有效。
-
设计模式与架构实践提升JavaScript代码的可维护性、可扩展性和可复用性。工厂模式用于按条件创建对象,如表单验证器;单例模式确保全局唯一实例,适用于配置管理;观察者模式实现状态变化自动通知,支撑事件总线与响应式系统。模块化按功能划分业务单元,结合ES6import/export支持静态分析与tree-shaking;通过TypeScript定义接口契约,依赖抽象解耦模块。引入依赖注入便于测试,状态管理依项目规模选用Context、ReduxToolkit或Zustand。最终目标是在合理场景应用恰当模
-
构建基于全链路耗时打点的前端性能“漏斗模型”,核心不是单纯看页面加载快慢,而是把用户一次关键交互(比如点击下单、提交表单、播放视频)拆解成若干有先后依赖的技术环节,每个环节记录真实耗时与成功状态,从而定位“卡在哪一步”“为什么失败”。它和传统业务漏斗互补:业务漏斗告诉你“谁没走到最后”,性能漏斗告诉你“走到这步的人,为什么卡住或放弃”。明确关键交互路径与技术节点先锁定你要分析的用户动作,再逆向拆解其背后的技术链路。不能只写“下单成功”,要细化到可测量的原子事件:用户点击“立即购买”按钮(交互
-
HTML视频在后台暂停是浏览器主动限制策略,非bug;因隐私与性能考量,页面失焦时video.paused为true、currentTime冻结、音频静音,autoplay+muted仅解决首帧播放而非后台持续运行。
-
图片加载失败时alt文案不显示,通常不是alt写错,而是图片未用<img>标签、被CSS隐藏、或动态插入时src非法/为空导致浏览器未触发加载失败逻辑;alt必须存在于合法<img>中且非空(装饰图用alt=""),否则无法生效。
-
高阶Mixin本质是返回Mixin的Mixin,通过带括号调用实现嵌套混入配置与参数透传,专注组合逻辑而非直接输出样式,需显式传参、避免递归、慎用隐式作用域。
-
移动端横竖屏切换抖动源于视口重算、样式未同步与交互干扰叠加,需通过完善viewport设置、用matchMedia+requestAnimationFrame提前响应、重置弹性布局及禁用干扰交互样式来切断抖动链路。
-
Next.js13+app目录下CSS生效需严格遵循导入规则:仅app/layout.tsx中import'./globals.css'有效;非模块CSS不可在组件内导入;CSSModules必须用.module.css后缀并按对象使用;删除next.config.js中冗余css配置;Tailwind需配置content路径;禁用_customDocument,所有样式注入须通过layout顶层import实现。
-
cite属性与cite元素语义不同:前者是URL链接,仅用于blockquote、q等4个标签;后者仅包裹作品标题,不可含作者、年份或URL。需组合使用并辅以CSS增强可识别性。
-
多重box-shadow拖尾粒子通过同一元素多层偏移、透明度递减、模糊渐变实现,需统一偏移方向、控制模糊值防糊化,禁用drop-shadow因不支持多层独立配置,动画应预设状态并启用GPU加速。
-
overflow:auto通过触发BFC解决边框消失问题,但易引发滚动条、裁剪绝对定位元素等问题;推荐用display:flow-root或伪元素清除。
-
JavaScript继承基于[[Prototype]]链,class仅为语法糖;new操作自动设置实例的__proto__指向构造函数prototype;Object.create可手动模拟原型链,但需注意constructor修复与赋值行为。