# 1. 移动端适配方案演进，rem+flexible、vw/vh、px+媒体查询的原理与现代选型？为什么 vw 方案已成主流？ A rem 方案不需要任何 JS 支持 B vw 以视口为基准、免 JS 运行时且实时响应，取代了依赖 JS 设置根字号的 flexible 方案成为主流 ✓ 正确答案 C 媒体查询方案会等比缩放所有元素 D vw 方案无法适配旋转屏幕
# 2. 移动端 WebView 与浏览器环境差异，JSBridge 通信、Cookie 同步、缓存策略的适配要点？ A WebView 与系统浏览器行为完全一致 B WebView 存在 API 与后台行为差异，JSBridge 需检测与安全治理，Cookie 同步与缓存版本化是适配重点 ✓ 正确答案 C WebView 中无需处理登录态 D 缓存策略与浏览器完全相同
# 3. iOS 橡皮筋滚动（rubber-banding）与下拉刷新的禁用，overscroll-behavior 的兼容边界与 body 滚动锁定的取舍？ A overscroll-behavior 可禁边界滚动与下拉刷新但 iOS 低版本不支持，需 JS 滚动锁定兜底并注意副作用 ✓ 正确答案 B overscroll-behavior 在所有 iOS 版本都有效 C overflow:hidden 在 iOS 上总能锁定滚动 D touchmove 拦截不影响任何滚动
# 4. 1px 边框问题的成因（DPR）与解决方案（transform 缩放/border-image）？ A 1px 变粗只发生在低分辨率设备 B 高 DPR 下 1px 逻辑像素无法精确映射物理像素，transform 按 1/dpr 缩放是主流方案，需统一封装 ✓ 正确答案 C border-image 是现代最推荐方案 D box-shadow 方案在所有浏览器表现一致
# 5. 300ms 点击延迟与点击穿透的历史成因及现代浏览器的解决状态？ A 现代浏览器仍保留 300ms 点击延迟 B 移动端仍需引入 fastclick 库 C 点击穿透只影响视觉 D 300ms 延迟源于双击缩放等待，viewport 声明与 touch-action: manipulation 后已消除，穿透需用 touch 事件预防 ✓ 正确答案
# 6. 移动端手势冲突（H5 滚动与原生滑动、下拉刷新与页面滚动）如何协调？ A 手势冲突只能靠 JS 判断 B touch-action: pan-y 会禁用纵向滚动 C 手势协调用 touch-action 声明 + 方向/位置裁决 + 滚动容器隔离，下拉刷新需在顶部且下拉阈值判定 ✓ 正确答案 D 弹层打开不需要锁定背景
# 7. 移动端 H5 性能优化专项，首屏白屏时间、JS 执行阻塞、图片懒加载与预加载策略？ A 首屏优化只需压缩图片 B 长任务无法拆分 C 懒加载适合所有图片 D 白屏优化需分网络/解析/渲染阶段治理，JS 长任务拆分与按需加载，图片按视口位置选懒加载或预加载 ✓ 正确答案
# 8. iOS/Android 键盘弹起对页面布局的影响（viewport 变化）与适配方案？ A 键盘弹起使视觉视口变化，iOS 需 visualViewport 事件感知、Android 行为各异，布局应避免依赖 100vh ✓ 正确答案 B iOS 键盘弹起会触发 window resize C 100vh 在移动端始终可靠 D 键盘弹起不影响固定定位元素
# 9. rem/vw/vh 适配方案，原理与边界（1px、安全区）？ A rem/vw 缩放会解决 1px 变粗问题 B vw/rem 按视口缩放布局，字体与 1px 需专项处理，安全区用 env() 叠加，极端宽度需限幅 ✓ 正确答案 C 100vh 在所有场景都稳定 D 安全区与 vw 布局无关
# 10. 移动端视口（viewport）与布局视口，meta viewport 的作用？ A 布局视口默认等于屏幕宽度 B viewport-fit=cover 不需要安全区适配 C visual viewport 变化不影响布局 D 布局视口是 CSS 布局基准（默认宽于屏幕），meta viewport 的 width=device-width 使其对齐设备宽度 ✓ 正确答案
# 11. safe-area（刘海屏安全区）适配的 env(safe-area-inset-*) 用法？ A env(safe-area-inset-bottom) 在所有设备上都是固定值 B 键盘弹起时底部 inset 不变 C 安全区适配只影响 iOS D 配合 viewport-fit=cover，用 env(safe-area-inset-*) 为刘海与手势条留白，需用 max() 兜底并区分贴边元素 ✓ 正确答案
# 12. 移动端 H5 调试方案，vConsole/eruda 注入、Chrome Remote Debugging、Safari Web Inspector？ A vConsole 提供完整的断点调试能力 B vConsole/eruda 注入页面内调试台适合现场排障，Chrome Remote Debugging 与 Safari Web Inspector 提供完整 DevTools ✓ 正确答案 C Safari Web Inspector 可以在 Windows 上连接 iOS D 线上环境必须永久注入 vConsole
# 13. 移动端点击延迟与 300ms，touch 事件的优化？ A 现代浏览器在 viewport 与 touch-action 配置下已消除 300ms 延迟，touch 优化重点是即时响应、阈值判定与穿透防护 ✓ 正确答案 B 移动端仍普遍存在 300ms 点击延迟 C touchmove 监听必须 preventDefault D pointer 事件无法替代 touch 事件
# 14. H5 与原生交互，JSBridge 与 URL Scheme？ A URL Scheme 适合高频双向通信 B JSBridge 无法传递回调结果 C JSBridge 注入桥对象支持双向实时调用，URL Scheme 适合唤起兜底，桥接层需统一封装与安全校验 ✓ 正确答案 D 任意页面都可以访问注入的桥对象
# 15. 触摸事件与手势，touch/pointer 事件的差异？ A pointer 事件只能用于鼠标 B touch 事件支持悬停语义 C pointer 事件统一鼠标/触摸/笔并支持捕获与多点，配合 touch-action 是手势开发的现代首选 ✓ 正确答案 D pointer 事件不需要兼容处理
# 16. H5 的调试，真机调试与 vConsole？ A vConsole 可以代替断点调试 B 开发期用 Remote Debugging/Web Inspector 断点，验收与线上用 vConsole 注入查看并配合日志上报闭环 ✓ 正确答案 C 生产环境应默认注入 vConsole D iOS 调试无需 macOS
# 17. 移动端 text-size-adjust 与 format-detection，iOS Safari 自动放大字号与识别电话号码的机制，以及对应的 meta/属性适配？ A text-size-adjust 与电话号码识别无关 B 设置 width=device-width 后所有 iOS 版本都不再放大字号 C format-detection 只能开启电话识别 D iOS 会自动放大字号与识别电话链接，分别用 text-size-adjust 与 format-detection 全局关闭、按需保留 ✓ 正确答案
