-
本文介绍如何用语义化<p>标签替代传统表单输入框，通过JavaScript实现点击激活、CSS状态反馈，并在页面加载时读取初始值，适用于轻量级计算器等交互式UI场景。
-
定位与margin结合可精准控制元素位置：absolute/relative/fixed通过top/left等设初始位，margin微调，如负margin居中需知尺寸，transform更适合响应式，relative下margin叠加偏移，fixed可用margin避让边距。
-
white-space是控制文字换行的第一道开关，需设为normal才允许折行；中文/长英文需配合overflow-wrap:break-word或word-break:break-all；Flex/Grid项要加min-width:0；兼容旧版Safari需同时写word-wrap和overflow-wrap。
-
正确做法是将transition:color0.3s写在元素默认状态（如a{color:#333;transition:color0.3sease;}），而非hover状态，并统一颜色格式（如全用hex或rgb），以确保平滑过渡。
-
小屏卡片错位或溢出主因是视口控制缺失与弹性容器响应边界不当，具体表现为width固定、min-width过大、flex-wrap未启用；应改用clamp()自适应宽度，配合aspect-ratio、line-clamp和contain优化性能。
-
fr单位实现等比宽度分配时，grid-template-columns:1fr1fr1fr使三列均分剩余空间；混用px与fr时，fr仅分配扣除固定宽度后的剩余空间；需设min-width:0等防止内容撑开破坏比例。
-
JSON.parse()和JSON.stringify()本身很快，但高频或大数据量时因内存分配、GC压力及主线程阻塞会导致明显卡顿；10KB以下无感，1–5MB阻塞20–100ms，超10MB易触发长任务。
-
JavaScript操作浏览器全屏需调用元素的requestFullscreen()和document的exitFullscreen()方法，1.必须由用户手势触发；2.需处理浏览器兼容性前缀；3.通过fullscreenchange事件监听状态变化；4.可封装工具函数统一管理；5.注意UI适配、样式调整及性能优化，确保良好用户体验。
-
闭包是JavaScript中函数与其词法作用域的组合，内部函数能持续访问外部函数变量，因作用域链在创建时固化且变量不被回收。
-
视频加载失败时可通过onerror事件捕获并处理，如显示备用封面、提示信息或切换备用源，结合多格式支持与路径检查可有效提升兼容性与用户体验。
-
Jest需配置Babel支持才能解析ES6/JSX，测试文件须命名规范（.test.js或__tests__目录），mock必须在import前调用，且需用jest.resetModules()和jest.clearAllMocks()清理状态。
-
通过预加载关键CSS、内联首屏动画和控制触发时机来优化页面动画表现。首先使用<linkrel="preload">提前加载核心动画文件，并通过onload转为样式表；对首屏必需动画（如按钮悬停）将CSS内联至<head>中，确保渲染前就绪；再通过JavaScript在DOM加载完成后添加动画类，避免突兀播放；最后用prefetch预取后续页面动画资源。关键是提前加载+控制触发+内联核心。
-
Grid布局通过定义网格容器和自动填充行实现列对齐，Flexbox结合多列可模拟瀑布流；关键在于使用gap、grid-auto-rows与break-inside:avoid确保视觉整齐。
-
HTMLselect不支持readonly，需用disabled加隐藏域或pointer-events:none；title仅纯文本提示且移动端无效，推荐disabled+spantitle或div模拟下拉实现只读与提示。
-
答案：大文件分片上传通过FileAPI将文件切块上传，提升稳定性和效率。前端使用slice方法分割文件，每片独立上传，后端接收存储并按序合并，最终完成完整文件传输。
