电商页面优化逻辑怎么写好

网站 CSS 动画在部分浏览器不生效

1. 添加浏览器前缀（-webkit-、-moz-、-ms-）适配不同内核；2. 避免使用过于复杂的动画属性，选择标准支持的属性；3. 检查动画触发条件是否正确（如 hover、class 切换）；4. 用 Can I Use 查询属性兼容性，提供降级方案

网站输入框聚焦后键盘遮挡输入框（移动端）

1. 检查输入框所在容器是否设置 scrollIntoView 属性，聚焦后自动上移；2. 修复移动端页面 meta 标签的 viewport 配置，避免缩放影响；3. 调整输入框位置，避免位于页面底部；4. 监听键盘弹出事件，动态调整页面高度

网站数据库恢复失败

1. 检查备份文件是否完整，无损坏；2. 核实数据库版本是否与备份文件兼容；3. 修复恢复脚本，确保数据正确导入；4. 关闭数据库写入操作，避免恢复时数据冲突

网站分页功能异常，无法翻页

1. 检查分页参数传递是否正确（如 page、limit）；2. 核实后端分页查询逻辑，是否正确计算总页数；3. 修复分页链接跳转地址，确保指向正确页面；4. 测试边界情况（第一页、最后一页、超出范围）

网站下拉框选项动态加载时卡顿

1. 检查动态加载接口是否优化，返回数据是否分页；2. 修复加载逻辑，添加防抖处理，避免输入过快导致频繁请求；3. 核实返回数据是否过滤无效选项，减少数据量；4. 优化下拉框渲染，避免频繁 DOM 操作

网站导航栏滚动固定后遮挡页面内容

1. 检查固定导航栏的高度，给页面主体添加对应的 padding-top；2. 修复滚动事件监听，确保固定后调整页面布局；3. 核实导航栏是否设置了 position: fixed 且 top: 0；4. 优化移动端导航栏，采用折叠式避免遮挡

网站富文本编辑器无法插入链接

1. 检查链接插入功能的配置，是否限制了链接协议（如仅允许 http/https）；2. 修复链接参数验证逻辑，确保 URL 格式正确；3. 核实是否存在权限限制，禁止插入外部链接；4. 处理插入后的链接样式，确保可点击、无样式遮挡

网站大文件下载时进度条不更新

1. 检查 XMLHttpRequest 的 progress 事件监听是否正确；2. 修复进度计算逻辑，确保 loaded 和 total 参数获取准确；3. 核实服务器是否返回 Content-Length 头，无该头无法计算进度；4. 处理分块下载时的进度累加，确保总进度正确

网站分页控件页码显示不全，超出屏幕

1. 检查分页控件的样式配置，是否设置了最大显示页码数（如显示 5 个页码）；2. 修复分页渲染逻辑，超出部分用 “...” 代替，显示首尾页码；3. 调整分页控件宽度，适应不同屏幕尺寸；4. 移动端优化为下拉选择页码，节省空间